Angular 10 tries to parse string as typescript code

1
votes

When using a string as input from parent to a child component, Angular tries to parse the string as TS code and throws an error.

Example: https://stackblitz.com/edit/angular-10-communicating-between-components-8yqvse?file=src%2Fapp%2Fapp.component.html

This did not happen in Angular 8: https://stackblitz.com/edit/angular-8-getting-started-ytub1a?file=src%2Fapp%2Fapp.component.html

What caused this issue? There is no mention of parser change in Angular 10 release note.

1
angulartypescript
While it's nice that you provide reproducible example projects, please also post fragments of the code in your question. If the stackblitz projects become unavailable at some point, it would be tough to understand your question. - code-gorilla

1 Answers

3
votes

This happen because string has interpolation inside {{ option }}. Check interpolation docs

So if you assign a variable to option or remove brackets will works.

Working example: https://stackblitz.com/edit/angular-10-communicating-between-components-cugx4n?file=src/app/app.component.ts

Edit: Here is the exactly commit that introduce this.