diff --git a/packages/compiler-cli/test/compliance/r3_view_compiler_i18n_spec.ts b/packages/compiler-cli/test/compliance/r3_view_compiler_i18n_spec.ts index 1f71e3f70e..fb378ed20b 100644 --- a/packages/compiler-cli/test/compliance/r3_view_compiler_i18n_spec.ts +++ b/packages/compiler-cli/test/compliance/r3_view_compiler_i18n_spec.ts @@ -1146,6 +1146,39 @@ describe('i18n support in the view compiler', () => { verify(input, output); }); + + it('should not be generated in case we have styling instructions', () => { + const input = ` + Text #1 + Text #2 + `; + + const output = String.raw ` + const $_c0$ = ["myClass", 1, "myClass", true]; + const $MSG_EXTERNAL_5295701706185791735$ = goog.getMsg("Text #1"); + const $_c1$ = ["padding", 1, "padding", "10px"]; + const $MSG_EXTERNAL_4722270221386399294$ = goog.getMsg("Text #2"); + … + consts: 4, + vars: 0, + template: function MyComponent_Template(rf, ctx) { + if (rf & 1) { + $r3$.ɵelementStart(0, "span"); + $r3$.ɵi18nStart(1, $MSG_EXTERNAL_5295701706185791735$); + $r3$.ɵelementStyling($_c0$); + $r3$.ɵi18nEnd(); + $r3$.ɵelementEnd(); + $r3$.ɵelementStart(2, "span"); + $r3$.ɵi18nStart(3, $MSG_EXTERNAL_4722270221386399294$); + $r3$.ɵelementStyling(null, $_c1$); + $r3$.ɵi18nEnd(); + $r3$.ɵelementEnd(); + } + } + `; + + verify(input, output); + }); }); describe('ng-container and ng-template', () => { diff --git a/packages/compiler/src/render3/view/template.ts b/packages/compiler/src/render3/view/template.ts index 0019f336ed..e62b259f5a 100644 --- a/packages/compiler/src/render3/view/template.ts +++ b/packages/compiler/src/render3/view/template.ts @@ -535,8 +535,8 @@ export class TemplateDefinitionBuilder implements t.Visitor, LocalResolver const createSelfClosingInstruction = !stylingBuilder.hasBindingsOrInitialValues && !isNgContainer && element.outputs.length === 0 && i18nAttrs.length === 0 && !hasChildren(); - const createSelfClosingI18nInstruction = - !createSelfClosingInstruction && hasTextChildrenOnly(element.children); + const createSelfClosingI18nInstruction = !createSelfClosingInstruction && + !stylingBuilder.hasBindingsOrInitialValues && hasTextChildrenOnly(element.children); if (createSelfClosingInstruction) { this.creationInstruction(element.sourceSpan, R3.element, trimTrailingNulls(parameters));