11

我已将我的 Angular 7 应用程序迁移到 8.0.0，我现在正在尝试新的编译器常春藤。

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

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

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

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

入口点“angular-tree-component”中的警告包含对“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'。这可能不是问题，但可能会导致入口点的编译出现乱序。

有任何想法吗 ？

4

6 回答 6

10

问题是在您的应用程序的某个地方，您将@Input装饰器与查询装饰器之一（@ContentChild, @ContentChildren, @ViewChild, @ViewChildren, @Query）一起使用。这种装饰器的组合实际上没有任何意义，并且可能会阻止编译器正确分析您的代码，因此您会收到错误消息Cannot combine @Input decorators with query decorators。

查看您的代码并@Input从应用了查询装饰器的成员中删除每个装饰器。此外，您可以检查所有 3rd 方库是否与 angular 8.0.0 兼容。

于 2019-06-06T08:27:00.683 回答
4

我在一个项目中遇到过同样的错误，我发现我的package.json中的ng-bootstrap版本是 3.0.0，而 angular 版本是 8.0。

我将 ng-bootstrap 库升级到 5.0.0 并解决了问题。

所以本质上，这是由于库不匹配的版本，你也可以在这个方向搜索......

于 2019-11-21T11:05:21.273 回答
3

升级到 Angular 9 我得到了同样的错误，对我来说，这个错误的负责代码如下：

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

问题是我不能组合@Input()and @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;
  }
}
于 2020-03-18T14:19:18.810 回答
1

我有一个类似的问题，我可以让我的 Angular 应用程序运行的唯一方法是禁用引导库中的违规代码。

我注释掉了对评级模块的引用：- node_modules/@ng-bootstrap/ng-bootstrap/index.js文件中的NgbRatingModule。

@Obaid 以上可能是正确的，但我找不到冲突。

于 2020-09-09T20:20:01.940 回答
0

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

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

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

于 2021-01-04T16:55:45.143 回答
0

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

于 2021-05-09T03:00:16.993 回答