-
Notifications
You must be signed in to change notification settings - Fork 27.1k
i18n tagged sub component inputs are bleeding interpolation values #41869
Description
🐞 bug report
Affected Package
Relating to @angular/localize and Ivy rendering
Is this a regression?
Unsure, as this project was created for Angular 11.
Description
When passing multiple interpolated values into a sub component and marking those inputs as i18n-, the dynamic portion of the input is bleeding into the next dynamic input.
<app-sub-component
firstTest="This string contains number 1 {{ numberOne }}"
i18n-firstTest
secondTest="This string should contain number 2 but instead includes 1 {{ numberTwo }}"
i18n-secondTest
></app-sub-component>This error occurs when running before and after extraction and in develop or production configurations. This issue disappears when disabling Ivy but we would prefer to continue with Ivy given its benefits.
🔬 Minimal Reproduction
A stackblitz has been created but does not present the problem. This is likely due to stackblitz and Ivy issues. A github repo has been provided to present the problem locally with Ivy running correctly.
- stackblitz: https://stackblitz.com/edit/test-angular-i18n-interpolation?file=src/polyfills.ts
- github: https://github.com/calummm/test-angular-i18n-interpolation
The application can be started with the standard npm i npm start commands.
There is a single page displaying a subcomponent with expected and actual values. The first sub component has i18n attributes, the second does not.
test with i18n "braces again" is showing an incorrect actual of 1 instead of 3.
test with i18n "multi" is showing an incorrect actual of 1 3 1 instead of 1 2 3
🔥 Exception or Error
No explicit error message
🌍 Your Environment
Angular Version:
Angular CLI: 11.2.11
Node: 12.18.3
OS: win32 x64
Angular: 11.2.12
... animations, common, compiler, compiler-cli, core, forms
... localize, platform-browser, platform-browser-dynamic, router
Ivy Workspace: Yes
Package Version
---------------------------------------------------------
@angular-devkit/architect 0.1102.11
@angular-devkit/build-angular 0.1102.11
@angular-devkit/core 11.2.11
@angular-devkit/schematics 11.2.11
@angular/cli 11.2.11
@schematics/angular 11.2.11
@schematics/update 0.1102.11
rxjs 6.6.7
typescript 4.0.7