如何动态翻译ngx-translate资源

Question

我有一个关于ngx-translate的问题。我不知道如何让一个动态资源翻译成html。例如：

i18n

    "agreement.status.0": "New",
    "agreement.status.1": "Rejected",

html

   <span>
        <mat-form-field appearance="outline">
            <mat-label>{{'choiceType' | translate}}</mat-label>
            <mat-select [(ngModel)]="selectedAgreementType">
                <mat-option *ngFor="let state of agreementStates" [value]="state.id">
                    {{ 'agreement.status.' + state.id | translate}}
                </mat-option>
            </mat-select>
        </mat-form-field>
    </span>

我不知道如何将这个常量字符串与变量连接起来

Answer 1

您可以从后台获得帮助；

translate(id){
return this.translate.instant('agreement.status.' + id);
}

并像这样使用它

<mat-option *ngFor="let state of agreementStates" [value]="state.id">
{{translate(state.id) }}
<mat-option>

Answer 2

您可以在别名中使用'agreement.status' | translate，并在选项中使用它。

 <span *ngIf="('agreement.status' | translate) as status">
    <mat-form-field appearance="outline">
        <mat-label>{{'choiceType' | translate}}</mat-label>
        <mat-select [(ngModel)]="selectedAgreementType">
            <mat-option *ngFor="let state of agreementStates" [value]="state.id">
                {{ status[state.id] }}
            </mat-option>
        </mat-select>
    </mat-form-field>
 </span>