Angular ngx-translate - 如何為翻譯值中缺少的參數設置默認值

Question

我希望翻譯值中的預期參數有一個默認值，以防程序員不提供。

例如，對於en.json這個鍵：

"NoRecordsWereFound": "No matching {{records}} were found for your search.",

在 HTML 中，當提供records參數時，如下所示：

<span>
    {{('NoRecordsWereFound' | translate:{ records: 'books' })}}
</span>

我將進入瀏覽器：

沒有找到符合您搜索條件的圖書。

但是如果不提供參數，就像這里：

<span>
    {{'NoRecordsWereFound' | translate}}
</span>

而不是得到這個：沒有找到匹配的{{records}}為您的搜索找到。

我會得到一些默認值，比如：

沒有為您的搜索找到匹配的defaultValue 。

是否可以？ 謝謝！

Answer 1

Ngx-translate 沒有提供這樣的功能，但你在 Angular 中有很多選擇來實現這一點。 以下是一些建議：

1. *ngIf 的使用

您可以使用 *ngIf 來引用不同的翻譯：

<span *ngIf="books">
    {{('NoRecordsWereFound' | translate:{ records: books })}}
</span>
<span *ngIf="!books">
    {{('NoRecordsWereFound Default' | translate )}}
</span>

2. 在 init 或錯誤狀態設置默認值

您始終可以在組件的 init 上設置默認值，或者如果您進行了某些方法調用，則可以為錯誤響應設置默認值。

@Component({
  selector: 'my-app',
  template: `
   <span>
    {{('NoRecordsWereFound' | translate:{ records: books })}}
   </span>
  `,
})
export class AppComponent  {
  books = 'default value';
}

您還可以使用商店為不同的場景設置默認狀態。