fix(compiler): generate constant array for i18n attributes (#23837)

PR Close #23837

Author: vicb

packages/compiler/src/constant_pool.ts

@@ -295,8 +295,9 @@ class KeyVisitor implements o.ExpressionVisitor {
                                   `EX:${ast.value.runtime.name}`;
   }
 
+  visitReadVarExpr(node: o.ReadVarExpr) { return `VAR:${node.name}`; }
+
   visitWrappedNodeExpr = invalid;
-  visitReadVarExpr = invalid;
   visitWriteVarExpr = invalid;
   visitWriteKeyExpr = invalid;
   visitWritePropExpr = invalid;

packages/compiler/src/render3/view/template.ts

@@ -257,13 +257,11 @@ export class TemplateDefinitionBuilder implements t.Visitor<void>, LocalResolver
     // Add the attributes
     const i18nMessages: o.Statement[] = [];
     const attributes: o.Expression[] = [];
-    let hasI18nAttr = false;
 
     Object.getOwnPropertyNames(outputAttrs).forEach(name => {
       const value = outputAttrs[name];
       attributes.push(o.literal(name));
       if (attrI18nMetas.hasOwnProperty(name)) {
-        hasI18nAttr = true;
         const meta = parseI18nMeta(attrI18nMetas[name]);
         const variable = this.constantPool.getTranslation(value, meta);
         attributes.push(variable);
@@ -272,13 +270,9 @@ export class TemplateDefinitionBuilder implements t.Visitor<void>, LocalResolver
       }
     });
 
-    let attrArg: o.Expression = o.TYPED_NULL_EXPR;
-
-    if (attributes.length > 0) {
-      attrArg = hasI18nAttr ? getLiteralFactory(this.constantPool, o.literalArr(attributes)) :
-                              this.constantPool.getConstLiteral(o.literalArr(attributes), true);
-    }
-
+    const attrArg: o.Expression = attributes.length > 0 ?
+        this.constantPool.getConstLiteral(o.literalArr(attributes), true) :
+        o.TYPED_NULL_EXPR;
     parameters.push(attrArg);
 
     if (element.references && element.references.length > 0) {

packages/compiler/test/render3/r3_view_compiler_i18n_spec.ts

@@ -93,10 +93,7 @@ describe('i18n support in the view compiler', () => {
        * @desc desc
        */
       const $msg_1$ = goog.getMsg('introduction');
-      …
-      const $c1$ = ($a1$:any) => {
-        return ['title', $a1$];
-      };
+      const $c1$ = ['title', $msg_1$];
       …
       /**
        * @desc desc
@@ -106,7 +103,7 @@ describe('i18n support in the view compiler', () => {
       …
       template: function MyComponent_Template(rf: IDENT, ctx: IDENT) {
         if (rf & 1) {
-          $r3$.ɵE(0, 'div', $r3$.ɵf1($c1$, $msg_1$));
+          $r3$.ɵE(0, 'div', $c1$);
           $r3$.ɵT(1, $msg_2$);
           $r3$.ɵe();
         }
@@ -147,14 +144,11 @@ describe('i18n support in the view compiler', () => {
        * @meaning m
        */
       const $msg_1$ = goog.getMsg('introduction');
-      …
-      const $c1$ = ($a1$:any) => {
-        return ['id', 'static', 'title', $a1$];
-      };
+      const $c1$ = ['id', 'static', 'title', $msg_1$];
       …
       template: function MyComponent_Template(rf: IDENT, ctx: IDENT) {
         if (rf & 1) {
-          $r3$.ɵE(0, 'div', $r3$.ɵf1($c1$, $msg_1$));
+          $r3$.ɵE(0, 'div', $c1$);
           $r3$.ɵe();
         }
       }