question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Hybrid mode doesn't allow NG1 upgrades after app is bootstrapped.

See original GitHub issue

I’m submitting a … (check one with “x”)

[ X] bug report
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question

Current behavior Loading a component dynamically using ViewContainerRef.createComponent() fails in case of ng1 child component. The issue here is NG2 component being loaded dynamically contains an NG1 child component. And Upgrade Adapter fails to bind the scope of upgraded NG1 component throwing below exception.

EXCEPTION: Error: Uncaught (in promise): EXCEPTION: Error in ./DynamicComponent class DynamicComponent - inline template:0:0
ORIGINAL EXCEPTION: TypeError: Cannot read property 'scope' of null
ORIGINAL STACKTRACE:
TypeError: Cannot read property 'scope' of null
    at new UpgradeNg1ComponentAdapter (https://npmcdn.com/@angular/upgrade@2.0.0-rc.4/bundles/upgrade.umd.js:440:57)
    at new UpgradeNg1ComponentAdapterBuilder.type._angular_core.Directive.Class.constructor (https://npmcdn.com/@angular/upgrade@2.0.0-rc.4/bundles/upgrade.umd.js:293:36)
    at DebugAppView._View_DynamicComponent0.createInternal rc.4/bundles/core.umd.js:12207:48)

Expected/desired behavior It should be possible to load a ng1 component dynamically in hybrid mode. Upgrade Adapter should allow NG1 upgrades even after app is bootstrapped.

Reproduction of the problem Here is the plunker : https://plnkr.co/edit/HADJILztGEELg5lavfvP?p=preview

What is the expected behavior? It should be possible to load a ng1 component dynamically in hybrid mode.

What is the motivation / use case for changing the behavior? Due to this issue, it’s not possible to (re) use the ng1 components inside ng2 app.

Please tell us about your environment:

  • Angular version: 2.0.0-rc.4
  • Browser: [Chrome 51 ] Version 51.0.2704.106 m
  • Language: [all | TypeScript 1.8 | ES5 ]

Issue Analytics

  • State:closed
  • Created 7 years ago
  • Reactions:2
  • Comments:5 (1 by maintainers)

github_iconTop GitHub Comments

1reaction
AlexKhymenkocommented, Aug 5, 2016

The same with services. After the application bootstraped you cant use services.

0reactions
angular-automatic-lock-bot[bot]commented, Sep 13, 2019

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

Read more comments on GitHub >

github_iconTop Results From Across the Web

14 - Stack Overflow
I currently have a Hybrid Angular app (2.4.9 and 1.5.0) using angular-cli. Currently, when running our application, we are able to bootstrap the ......
Read more >
Upgrading from AngularJS to Angular
To bootstrap a hybrid application, you must bootstrap each of the Angular and AngularJS parts of the application. You must bootstrap the Angular...
Read more >
Preparing your Angular 1 codebase to upgrade to React or ...
First, we can remove the wrapping IIFE since Webpack will package each file in its own closure. We can also remove 'use strict'...
Read more >
Libraries - Cumulocity IoT Guides
That will let your app start in a hybrid mode, which allows to use angular.js and Angular plugins/modules. To determine which extension points...
Read more >
@c8y/ngx-components - npm
ngx-components is a components collection and data access layer for Angular applications. It allows to access our platform from within an Angular ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found