Angular Ng1 / Ng2混合应用程序投掷＆＃39;没有提供$ scope＆＃39;例外

Question

我尝试使用NgUpgrade构建混合Ng1 / Ng2应用程序，作为向Angular 2迁移的中间步骤。

引导似乎有效：

platformBrowserDynamic().bootstrapModule(AppModule).then( () => {
  adapter.bootstrap(document.body, [Ng1AppModule.name]);
});

但我很难在Ng2组件中使用简单的Ng1指令，请看这个非常简单的plunker：https://plnkr.co/edit/gMSwKKIgEkwcijCCaCMW?p=preview

即使在升级了Ng1指令并降级了Ng2组件之后，浏览器也会为$ scope发送一个＆＃34; No提供商！＆＃34;异常。

我错过了什么？

我知道有些人已经报告了这个异常，但看起来NgUpgrade自Angular 2测试版以来已经发展了很多，我无法找到当前Angular 2版本的合适答案。

Answer 1

发现它！

我的错误是尝试直接引导ng2模块，但看起来你必须将ng1组件放在DOM的顶层（是的，它是在官方ngUpgrade指南中的某处写的）。以下是带有ng1根组件的正确更新plunker，它调用ng2模块，调用另一个ng1组件。

 const myNg1Root = {
     template: `
       <p>This is the Angular 1 root component</p>
       <ng2root></ng2root>
       `,
};