Repository: angular
Issue: extract-i18n produces incorrect "equiv-text" attributes of interpolation elements
Labels: area: i18n

### Command

extract-i18n

### Is this a regression?

- [ ] Yes, this behavior used to work in the previous version

### The previous version in which this bug was not present was

_No response_

### Description

In the XLF file generated by extract-i18n, there are sometimes incorrect values inside the "equiv-text" attributes of the interpolation elements. In these cases, "equiv-text" does contain parts of the surrounding text (sometimes including other HTML elements). It seems that the issue occurs when the interpolation element is located directly at the beginning of the translation unit (so a linebreak inside the HTML element fixes the output, see example below).

### Minimal Reproduction

**This example leads to the expected output:**

HTML template:
```
<div i18n="@@project.download.progressInfo.database">
    {{getRoundedProgress(databaseProgressPercent)}}% finished...
</div>
<div>Something else</div>
```

XLF generated by extract-i18n (using builder @angular-devkit/build-angular:extract-i18n):
```
<trans-unit id="project.download.progressInfo.database" datatype="html">
  <source> <x id="INTERPOLATION" equiv-text="{{getRoundedProgress(databaseProgressPercent)}}"/>% finished... </source>
  <context-group purpose="location">
    <context context-type="sourcefile">src/app/components/project/download-project-progress-modal.html</context>
    <context context-type="linenumber">12,14</context>
  </context-group>
</trans-unit>
```

**This example produces incorrect content in "equiv-text":**

HTML template:
```
<div i18n="@@project.download.progressInfo.database">{{getRoundedProgress(databaseProgressPercent)}}% finished...</div>
<div>Something else</div>
```


XLF generated by extract-i18n (using builder @angular-devkit/build-angular:extract-i18n):
```
<trans-unit id="project.download.progressInfo.database" datatype="html">
  <source><x id="INTERPOLATION" equiv-text="% finished...&lt;/div&gt;
  &lt;div&gt;Something else&lt;/div&gt;"/>% finished...</source>
  <context-group purpose="location">
    <context context-type="sourcefile">src/app/components/project/download-project-progress-modal.html</context>
    <context context-type="linenumber">12</context>
  </context-group>
</trans-unit>
```

### Exception or Error

_No response_

### Your Environment

```text
Angular CLI: 18.0.6
Node: 20.14.0
Package Manager: npm 10.7.0
OS: darwin arm64

Angular: 18.0.5
... animations, cdk, common, compiler, compiler-cli, core, forms
... localize, platform-browser, platform-browser-dynamic, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1800.6
@angular-devkit/build-angular   18.0.6
@angular-devkit/core            18.0.6
@angular-devkit/schematics      18.0.6
@angular/cli                    18.0.6
@schematics/angular             18.0.6
rxjs                            6.5.5
typescript                      5.4.5
zone.js                         0.14.7
```


### Anything else relevant?

_No response_