如何在页面初始化时翻译用 ngif 隐藏的文本？

Question

我正在设置 i18n 翻译来为我的 Web 应用程序实现多种语言。在我的 Web 应用程序中，我使用 Angular Material Steppers，这些步骤在某些操作完成之前是隐藏的。使用 ngIf 指令隐藏这些步骤。起初我将我的文本硬编码在 HTML 文件中，然后它工作正常，但现在当我通过将 ngIf 设置为 true 来显示步骤时，隐藏的步骤文本不会显示。

但是，当我不在页面初始化时使用 ngIf 隐藏我的步骤时，文本会显示。我也尝试使用 [hidden] 而不是 ngIf 但 mat-step 不支持 [hidden].

html 在实施 i18n 翻译之前（工作）

<mat-step [editable]="!done" *ngIf="companySelected" >
    <ng-template matStepLabel>contactinformation</ng-template>
</mat-step>

html 实施后

<mat-step [editable]="!done" *ngIf="companySelected" >
    <ng-template matStepLabel>{{ 'CONTACTGEGEVENS' | translate }}</ng-template>
</mat-step>

ts

companySelected = false;
onSelect(company: any) {

    this.company = company;
    this.newCompany = false;
    this.companySelected = true;
   this.nextTab();
  }

关于如何通过 ngIf 指令继续使用 i18n 翻译有什么想法吗？

Answer 1

问题出在我的 ngx translate 版本上，因为我使用的是 Angular 5。我使用的版本适用于 Angular 6 及更高版本。我做了 npm i @ngx-translate/core@9.1.1 以转到正确的版本并且它有效。不知道为什么它在其他任何地方都可以工作，除了在 ngif 中。

如何在页面初始化时翻译用 ngif 隐藏的文本？

How to translate text, that is hidden with ngif, on the initialization of the page?

translation

angular-i18n

angular