微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

angularjs – $scope的提供者!在角度2应用程序中使用角度1指令时出错

我有一个使用angular-cli构建的角度2应用程序,我需要在我的一个组件中使用角度1指令(从不同的应用程序重用它).我按照以下步骤操作:

https://angular.io/docs/ts/latest/guide/upgrade.html#!#using-angular-1-component-directives-from-angular-2-code

但现在我遇到了这个错误,无法超越它.我正在使用angular2.0.2(我设法在过去使用beta版本构建了一个混合应用程序,但它是一个angular1应用程序,我使用角度2组件与适配器的降级功能).

在我的app.module.ts中我有

import { UpgradeAdapter } from '@angular/upgrade';
const upgradeAdapter = new UpgradeAdapter(forwardRef(() => AppModule));

const HeroDetail = upgradeAdapter.upgradeNg1Component('heroDetail');

@NgModule({
    imports:      [
        @R_502_6437@wserModule,...
    ],declarations: [
      ...       
     HeroDetail
     ]
})
export class AppModule { }

我的hero-detail.component.ts看起来像这样:

export const heroDetail = {
  templateUrl: 'hero-detail.html',controller: function() {
  }
};

而我的hero-detail.html看起来像这样:

<h2>Windstorm details!</h2>

我只是通过添加模板尝试在另一个角度2组件中使用该指令:

当我运行服务时,应用程序编译正常,但当我尝试加载页面时,我得到上述错误.

关于如何向前推进的任何建议?

解决方法

看来你的引导逻辑不正确.

它实际上不是很明显,请确保:

>你不用@NgModule({bootstrap:[…]})引导任何ng2组件.相反,您应该在主模块中使用空的ngdobootstrap(){}方法.
>根模板是ng1模板.即在index.html中,您应该只有ng1组件或降级的ng2组件.您可以将ng2组件作为根,但是您需要先将其降级.

官方升级指南包含DOM结构的示例:

enter image description here

…确保ng2注射器具有ng1所需的所有提供者.

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。

相关推荐