Fix interpolation boundaries in text (#20117)

Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>
Co-authored-by: fisker Cheung <lionkay@gmail.com>

tests/format/angular/interpolation/html/18939.html

@@ -0,0 +1,2 @@
+{{}}
+{{ "{{num_of_selected_files}} / {{num_of_total_files}} files selected" | translate: {num_of_selected_files: 20, num_of_total_files: 30} }}

tests/format/angular/interpolation/html/__snapshots__/format.test.js.snap

@@ -16,6 +16,24 @@ parsers: ["angular"]
 ================================================================================
 `;
 
+exports[`18939.html format 1`] = `
+====================================options=====================================
+parsers: ["angular"]
+                                                      printWidth: 80 (default) |
+=====================================input======================================
+{{}}
+{{ "{{num_of_selected_files}} / {{num_of_total_files}} files selected" | translate: {num_of_selected_files: 20, num_of_total_files: 30} }}
+
+=====================================output=====================================
+{{}}
+{{
+  "{{num_of_selected_files}} / {{num_of_total_files}} files selected"
+    | translate: { num_of_selected_files: 20, num_of_total_files: 30 }
+}}
+
+================================================================================
+`;
+
 exports[`block.html format 1`] = `
 ====================================options=====================================
 parsers: ["angular"]

tests/format/vue/interpolation/__snapshots__/format.test.js.snap

@@ -75,6 +75,27 @@ parsers: ["vue"]
 ================================================================================
 `;
 
+exports[`double-brace-string.vue format 1`] = `
+====================================options=====================================
+parsers: ["vue"]
+                                                      printWidth: 80 (default) |
+=====================================input======================================
+<template>
+  <div>{{"{{first}} / {{second}} files selected"}}</div>
+  <div>{{'{{first}} / {{second}} files selected'}}</div>
+  <div>Before {{ "}}" }} between {{value}} after {{ "{{third}}" }}</div>
+</template>
+
+=====================================output=====================================
+<template>
+  <div>{{ "{{first}} / {{second}} files selected" }}</div>
+  <div>{{ "{{first}} / {{second}} files selected" }}</div>
+  <div>Before {{ "}}" }} between {{ value }} after {{ "{{third}}" }}</div>
+</template>
+
+================================================================================
+`;
+
 exports[`ng-non-bindable.vue format 1`] = `
 ====================================options=====================================
 parsers: ["vue"]

tests/format/vue/interpolation/double-brace-string.vue

@@ -0,0 +1,5 @@
+<template>
+  <div>{{"{{first}} / {{second}} files selected"}}</div>
+  <div>{{'{{first}} / {{second}} files selected'}}</div>
+  <div>Before {{ "}}" }} between {{value}} after {{ "{{third}}" }}</div>
+</template>