Angular 2+动态UI文本

Question

我正在开发一个不是多语言的应用程序，但客户端要求能够通过管理界面更改标签，文本甚至通知。所以我虽然可以在应用程序加载时从服务器获取资源文件并绑定所有标签，文本和通知。

不确定是否已经实施了某些内容，或者是否有更好的方法来实现这一目标。我有ng2-translate但它不会通过管理屏幕服务于可更改文本的目的。

谢谢。

Answer 1

可以使用模板绑定显示所有文本，例如{{ myLabel }}。反过来，myLabel可以根据对服务器的请求进行分配，该服务器接受语言参数，或者如果选择了某种语言设置，则可以使用本地存储的值。服务器选项是更易于管理的IMO。

async setText(languageId: number) {
  this.text = await this.http.get('yourUrl', {
    params: { languageId: languageId.toString()} }).toPromise();
}

文字可以是包含所有文字的对象，例如

"text": [
 "notifications": ["warningNotification": "whatever", ... 
] 

您可以在整个模板中显示这些内容：

<div id="warningDiv">{{ text?.notifications?.warning }}</div>

并始终遵循相同的模式，根据语言提供不同的text json对象。

注意问号是安全操作符，以避免在处理请求时出现空错误。