refactor(ivy): i18n - move marker block serialization to helpers (#32867)

Previously the metadata and placeholder blocks were serialized in
a variety of places. Moreover the code for creating the `LocalizedString`
AST node was doing serialization, which break the separation of concerns.

Now this is all done by the code that renders the AST and is refactored into
helper functions to avoid repeating the behaviour.

PR Close #32867

packages/compiler/src/output/abstract_emitter.ts

@@ -7,6 +7,7 @@
  */
 
 import {ParseSourceSpan} from '../parse_util';
+import {serializeI18nHead, serializeI18nTemplatePart} from '../render3/view/i18n/meta';
 
 import * as o from './output_ast';
 import {SourceMapGenerator} from './source_map';
@@ -362,13 +363,14 @@ export abstract class AbstractEmitterVisitor implements o.StatementVisitor, o.Ex
   }
 
   visitLocalizedString(ast: o.LocalizedString, ctx: EmitterVisitorContext): any {
-    ctx.print(ast, '$localize `' + ast.messageParts[0]);
+    const head = serializeI18nHead(ast.metaBlock, ast.messageParts[0]);
+    ctx.print(ast, '$localize `' + escapeBackticks(head));
     for (let i = 1; i < ast.messageParts.length; i++) {
       ctx.print(ast, '${');
       ast.expressions[i - 1].visitExpression(this, ctx);
-      // Add the placeholder name annotation to support runtime inlining
-      ctx.print(ast, `}:${ast.placeHolderNames[i - 1]}:`);
-      ctx.print(ast, ast.messageParts[i]);
+      ctx.print(
+          ast,
+          `}${escapeBackticks(serializeI18nTemplatePart(ast.placeHolderNames[i - 1], ast.messageParts[i]))}`);
     }
     ctx.print(ast, '`');
     return null;
@@ -558,3 +560,7 @@ function _createIndent(count: number): string {
   }
   return res;
 }
+
+function escapeBackticks(str: string): string {
+  return str.replace(/`/g, '\\`');
+}

packages/compiler/src/output/output_ast.ts

@@ -8,6 +8,7 @@
 
 
 import {ParseSourceSpan} from '../parse_util';
+import {I18nMeta} from '../render3/view/i18n/meta';
 import {error} from '../util';
 
 //// Types
@@ -482,8 +483,9 @@ export class LiteralExpr extends Expression {
 
 export class LocalizedString extends Expression {
   constructor(
-      public messageParts: string[], public placeHolderNames: string[],
-      public expressions: Expression[], sourceSpan?: ParseSourceSpan|null) {
+      readonly metaBlock: I18nMeta, readonly messageParts: string[],
+      readonly placeHolderNames: string[], readonly expressions: Expression[],
+      sourceSpan?: ParseSourceSpan|null) {
     super(STRING_TYPE, sourceSpan);
   }
 
@@ -1098,7 +1100,7 @@ export class AstTransformer implements StatementVisitor, ExpressionVisitor {
   visitLocalizedString(ast: LocalizedString, context: any): any {
     return this.transformExpr(
         new LocalizedString(
-            ast.messageParts, ast.placeHolderNames,
+            ast.metaBlock, ast.messageParts, ast.placeHolderNames,
             this.visitAllExpressions(ast.expressions, context), ast.sourceSpan),
         context);
   }
@@ -1584,9 +1586,9 @@ export function literal(
 }
 
 export function localizedString(
-    messageParts: string[], placeholderNames: string[], expressions: Expression[],
-    sourceSpan?: ParseSourceSpan | null): LocalizedString {
-  return new LocalizedString(messageParts, placeholderNames, expressions, sourceSpan);
+    metaBlock: I18nMeta, messageParts: string[], placeholderNames: string[],
+    expressions: Expression[], sourceSpan?: ParseSourceSpan | null): LocalizedString {
+  return new LocalizedString(metaBlock, messageParts, placeholderNames, expressions, sourceSpan);
 }
 
 export function isNull(exp: Expression): boolean {