Angular中动态内容的国际化?
问题描述:
Angular.io描述了i18n标签,如下所示:Angular中动态内容的国际化?
Angular i18n属性标记可翻译的内容。将其放在 的每个元素标记的固定文本将被翻译。
所以我的问题是这样的。如果我有一个内容为动态的元素怎么办?以下面的表格为例,其中显示了资产列表。在某些情况下,“描述”一栏需要使用英文,在某些情况下还需使用其他一些语言。
<table class="asset-table">
<thead>
<tr>
<th i18n="@@alarm-list-timeon">Time On</th>
<th i18n="@@alarm-list-timeoff">Time Off</th>
<th i18n="@@alarm-list-asset">Asset</th>
<th i18n="@@alarm-list-description">Description</th>
</tr>
</thead>
<tbody *ngIf="showAssets">
<tr *ngFor="let asset of pageItems">
<td>{{asset.timeon}}</td>
<td>{{asset.timeoff}}</td>
<td>{{asset.assetlabel}}</td>
<td i18n>{{asset.description}}</td>
</tr>
</tbody>
</table>
我的想法是这样的:
<table class="asset-table">
<thead>
<tr>
<th i18n="@@alarm-list-timeon">Time On</th>
<th i18n="@@alarm-list-timeoff">Time Off</th>
<th i18n="@@alarm-list-asset">Asset</th>
<th i18n="@@alarm-list-description">Description</th>
</tr>
</thead>
<tbody *ngIf="showAssets">
<tr *ngFor="let asset of pageItems">
<td>{{asset.timeon}}</td>
<td>{{asset.timeoff}}</td>
<td>{{asset.assetlabel}}</td>
<td i18n="@@{{asset.description}}">{{asset.description}}</td>
</tr>
</tbody>
</table>
...但我错了。有什么建议么?
答
首先,I18N值是一个ID,所以它总是是静态的。
其次,尽量翻译,改变内容,我有唯一的成功是在模板中使用NgSwitch一种解决方法。
在这个例子中,thingStatus
是你的变量,其可能的值是“好”,“坏”和“未知”。所有这些都将是一个单独的翻译项目,具有自己的i18n ID值。
显然,如果thingStatus
可能有可能性的难以管理的数量,这将失败。
<div [ngSwitch]="thingStatus">
<p *ngSwitchCase="good" i18n="status_good>Good</p>
<p *ngSwitchCase="bad" i18n="status_bad>Bad</p>
<p *ngSwitchCase="unknown" i18n="status_unknown>Unknown</p>
</div>
角度i18n是静态的,不是动态的。 – Ploppy