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