Upgrading to Angular 9 using Ivy, cannot combine @Input decorators with query decorators (@ContentChild)

Question

Upgrading to Angular 9 I got the followings errors related to a package:

Compiling @ngx-package : es2015 as esm2015

ERROR in Failed to compile entry-point @ngx-package (es2015 as esm2015) due to compilation errors:
node_modules/@ngx-package/@ngx-package.js:1325:34 - error NG1006: Cannot combine @Input decorators with query decorators

1325     'actions': [{ type: Input }, { type: ContentChild, args: [Component,] },],

The responsible code of this error is the following:

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

Searching for that error message brings up other questions asking the same thing. Not sure why this required a self-answered question? https://stackoverflow.com/questions/56457566/cannot-combine-input-decorators-with-query-decorators-using-ivy — Kurt Hamilton, Mar 18 '20 at 13:53
you're right, I didn't see that question, I am answering there. — Stefano Borzì, Mar 18 '20 at 14:13
partially, I think that my answer will give a concrete example of the solution of this case, doesn't it? — Stefano Borzì, Mar 18 '20 at 14:16
It's a concrete workaround, but it might be something you should be avoiding for a good reason. What's your use case for the original code? — Kurt Hamilton, Mar 18 '20 at 14:20
what do you mean? my use case is what I showed in this question & answer. I was upgrading to Angular 9 and a code had @input() and @ContentChild combined which is not allowed for Angular 9 — Stefano Borzì, Mar 18 '20 at 22:53

score 0 · Accepted Answer · answered Mar 18 '20 at 13:49

The problem is that I can't combine @Input() and @ContentChild, so I replaced the code responsible of the error with the following:

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;
  }
}

Upgrading to Angular 9 using Ivy, cannot combine @Input decorators with query decorators (@ContentChild)

1 Answers1