角度材料选择在应用程序启动时不显示当前的ngx-translate语言（在用户手动选择语言之前）

Question

我正在使用ngx-translate，它工作正常。以下代码（摘自官方示例）显示了当前的lang，并允许我进行切换：

<select #langSelect (change)="translate.use(langSelect.value)">
    <option *ngFor="let lang of translate.getLangs()" [value]="lang" [selected]="lang === translate.currentLang">{{ lang }}</option>
</select>

所有ngx-translate基础结构均取自文档，并将成为常驻。然后，我要使用材质选择（mat-select）而不是本机select：

<mat-select #langSelect (change)="translate.use(langSelect.value)">
  <mat-option 
    *ngFor="let lang of translate.getLangs()" 
    [value]="lang" 
    [selected]="lang === translate.currentLang"
  >
    {{ lang }}
  </mat-option>
</mat-select>

[你看，没有什么真正的不同。此代码还可以让我切换语言，但是在第一次更改之前不会显示当前语言。

我创建了简单的演示，它的视图并不完美，但是可以很容易地复制该问题：stackblitz。我想知道是否遗漏了一些东西，但是我确实停留在这里尝试使材质变体起作用，并在打开下拉菜单并选择一个语言之前，向我显示当前语言。

Answer 1

您可以尝试这个。您必须在[value]="translate.currentLang"中设置mat-select。

<mat-select [value]="translate.currentLang" class="lang" #langSelect (change)="translate.use(langSelect.value)">
    <mat-option 
    *ngFor="let lang of translate.getLangs()" 
    [value]="lang"
    >
       {{ lang }}
    </mat-option>
</mat-select>