如何告诉Angular2忽略嵌入的Angular1应用程序？

Question

我在Angular2组件中引导了一个Angular1应用程序。

模板：

<div #ng1Hook></div>
<input type="text" ng-model="vm.filters.date" />

组件：

@ViewChild('ng1Hook') div; 
ngAfterViewInit() {
    angular.bootstrap(this.div.nativeElement, ['ng1Module']);
}

问题在于NG2正在尝试解析其模板内的NG1代码。例如，在模板的下方会出现如下代码：ng-model="vm.filters.date"和当前NG2无法处理此问题。

现在，我的NG2组件抱怨它无法读取未定义的属性'xyz'，这是我在NG1组件模板中使用的ng-model=vm.xyz

如何通过电话NG2忽略其模板内的NG1代码？ 或者还有其他方法可以在NG2中正确嵌入NG1吗？

Answer 1

您可以添加属性ngNonBindable以防止Angular2处理绑定或实例化指令或组件。

如果动态添加HTML，Angular2也不会处理它

<div [innerHTML]="someHtml">

someHtml的内容将添加到DOM中，而不会以任何方式由Angular2处理。