5

我们最近将 Angular 应用程序升级到了最新版本的 Angular（Angular v9）。我们所有的依赖项也都升级了，“ng update”表示我们所有的依赖项都是“有序的”。

当我们在启用 Ivy 的情况下构建应用程序时，编译过程会失败并出现大量错误，这是我们以前从未遇到过的：

 "angularCompilerOptions": {
    "enableIvy": true
  }

有些错误很奇怪，说你不能绑定'ngClass'或'ngModel'，因为它不是'div'的已知属性。它似乎缺少一些主要模块。

例如：

src/app/register/register.component.html:34:48 - error NG8002: Can't bind to 'ngClass' since it isn't a known property of 'div'.

<div class="form-group has-feedback" [ngClass]="{ 'has-error': f.submitted && !fname.valid }">
                                                  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/app/modals/modal-recommendations/modal-recommendations.component.html:12:25 - error NG8002: Can't bind to 'ngClass' since it isn't a known property of 'div'.
<div class="modal-body" [ngClass]="{'text-center': recommendationNotVisible()}">
12 <div class="modal-body" [ngClass]="{'text-center': recommendationNotVisible()}">


src/app/dashboard/dashboard.component.html:53:17 - error NG8002: Can't bind to 'accountId' since it isn't a known property of 'app-metric-box'.
53                 [accountId]="accountId"

或者它无法识别某些组件，例如：

src/app/export/export-base/export-base.component.html:2:5 - error NG8001: 'router-outlet' is not a known element:
1. If 'router-outlet' is an Angular component, then verify that it is part of this module.
2. If 'router-outlet' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

2     <router-outlet></router-outlet>

错误主要有两种：

  1. 无法绑定到 [some-property]，因为它不是 [some-element] 的已知属性。属性可以是角度属性（ngClass，ngModel）或我们组件上的自定义属性。
  2. [some-component] 不是已知元素（同样，我们的自定义组件和角度组件都会出现这种情况）

如果我们禁用“Ivy”，一切正常，代码编译并运行顺利。

我们想开始使用 Ivy，所以我们正在寻找关于这些错误的解释以及如何修复它们。

谢谢！

4

2 回答 2

2

您需要将CUSTOM_ELEMENTS_SCHEMA添加到模块中的模式数组

import { NgModule, CUSTOM_ELEMENTS_SCHEMA }  from '@angular/core';

@NgModule({
    ...
    schemas: [ CUSTOM_ELEMENTS_SCHEMA ]
})
export class AppModule { }
于 2020-03-03T19:05:21.967 回答
0

我的问题是我有一个组件定义为入口组件。由于 Ivy 已弃用此功能，因此我从模块中删除了 entryComponents 属性。但是，在一种情况下，这会导致与您类似的错误。

error NG8002: Can't bind to 'ngClass' since it isn't a known property of 'div'

假设这发生在 text.component.html (TextComponent) 中。它有一个 TextModule，其中包含启用 ngClass 的 CommonModule 的导入。它位于 ParentComponent 下，之前在 ParentModule 中，它有一个带有 TextComponent 的 entry 属性。我怀疑 Ivy 只引入了 TextComponent 而不是 TextModule。所以我更新了 ParentModule 以导入文本模块并解决了错误。

前：

@NgModule({
     imports: []
     entryComponents: [TextComponent]
})
export class ParentModule { }

后：

@NgModule({
     imports: [TextModule]
})
export class ParentModule { }

因此，您的个人问题可能会有所不同，但我会看看您的模块和导入的结构。

于 2020-05-07T20:17:41.980 回答