docs: document //i18n(ph="name") placeholder syntax for template interpolations

The `//i18n(ph="name")` comment syntax for naming interpolation placeholders
in templates was not documented anywhere in the i18n guide, despite being a
supported compiler feature with test coverage.

Add a "Name the interpolation placeholder" subsection under "Mark text in
component template" in prepare.md, mirroring the existing subsection in
"Mark text in component code". Includes a cross-reference to the $localize
equivalent (`${var}:name:`) to help readers connect the two approaches.

Closes #52070
This commit is contained in:
arturovt
2026-05-20 18:29:21 +03:00
committed by Pawel Kozlowski
parent cbc36f59e0
commit 2b44a07ea7
+20
View File
@@ -48,6 +48,26 @@ The following example shows the `<ng-container>` element transformed into a non-
<docs-code path="adev/src/content/examples/i18n/src/app/app.component.html" region="i18n-ng-container"/>
### Name the interpolation placeholder
By default, Angular generates a placeholder name for each interpolation in a translated message. To give it a meaningful name that helps translators understand the context, add an `//i18n(ph="name")` comment inside the interpolation.
```html
<element i18n>{{ expression //i18n(ph="placeholder_name") }}</element>
```
For example:
```html
<p i18n>Hello, {{ username //i18n(ph="name") }}!</p>
```
This is the template equivalent of naming a placeholder in component code with [`$localize`][ApiLocalizeInitLocalize]:
```ts
$localize`Hello, ${username}:name:!`;
```
## Mark element attributes for translations
In a component template, the i18n metadata is the value of the `i18n-{attribute_name}` attribute.