无法使用 Ivy 将 @Input 装饰器与查询装饰器结合使用

Cannot combine @Input decorators with query decorators using Ivy

我已经将我的 angular 7 应用程序迁移到 8.0.0,我现在正在尝试新的编译器 ivy。

该应用程序在没有 ivy 的情况下可以完美运行,但是当我尝试使用它进行编译时出现以下错误:

Cannot combine @Input decorators with query decorators

没有行号,没有文件,什么都没有...很难调试任何东西。

在那之前我有警告,但我不知道它是否相关:

WARNING in Entry point 'angular-tree-component' contains deep imports into 'lodash/defaultsDeep', 'lodash/get', 'lodash/omit', 'lodash/isNumber', 'lodash/first', 'lodash/last', 'lodash/some', 'lodash/every', 'lodash/compact', 'lodash/find', 'lodash/isString', 'lodash/isFunction', 'lodash/throttle', 'lodash/includes', 'lodash/pick'. This is probably not a problem, but may cause the compilation of entry points to be out of order.

有什么想法吗?

问题是您在应用程序的某处将 @Input 装饰器与其中一个查询装饰器(@ContentChild@ContentChildren@ViewChild@ViewChildren@Query)。这种装饰器组合实际上没有任何意义,可能会阻止编译器正确分析您的代码,因此您会收到错误 Cannot combine @Input decorators with query decorators.

查看您的代码并从应用了查询装饰器的成员中删除每个 @Input 装饰器。此外,您可能会检查所有第 3 方库是否与 angular 8.0.0.

兼容

我在一个项目中遇到过同样的错误,我发现我的[=]中的ng-bootstrap版本20=] 是 3.0.0,angular 版本是 8.0.

我将 ng-bootstrap 库升级到 5.0.0,问题已解决。

所以本质上是库版本不匹配,你也可以往这个方向搜索...

升级到Angular 9 我得到了同样的错误,这个错误的责任代码,对我来说,如下:

@Input() @ContentChild(Component) actions: Component;

问题是我不能结合@Input()@ContentChild,所以我用以下代码替换了导致错误的代码:

get actions(): Component {
  return this._actions;
}

private _actions: Component;

@Input()
set actions(value: Component) {
  this._actions = value;
}

@ContentChildren(Component)
set viewActions(value: Component) {
  if (!this._actions && value) {
    this._actions = value;
  }
}

我遇到了类似的问题,获得 Angular 应用程序 运行 的唯一方法是禁用 bootstrap 库中的违规代码。

我注释掉了对评级模块的引用:- NgbRatingModulenode_modules/ @ng-bootstrap/ng-bootstrap/index.js 文件.

@Obaid 上面说的应该是对的,但是没找到冲突

我的问题是我错误地放置了多个查询装饰器,如下所示

@ViewChild(DataTableDirective, { static: false })
@ViewChild(DataTableDirective, { static: false })

所以问题只能通过删除一个装饰器来解决。

我在将我的项目从 angular v8 更新到 angular v11 时遇到了同样的问题。如果是这种情况,很可能是您激活了 --force 标志。我的建议是你不要。您检查它向您显示的警告并一一解决。 基本上警告意味着第三方库的更新。