在ng2-translate指令中更新translateParams

时间:2017-01-10 21:50:44

标签: angular ng2-translate

给出翻译字符串,例如:

"TIMEOUT": "Timeout in {{value}} seconds."

是否可以绑定value,以便在基础参数发生变化时触发ng2-translate更新已翻译的字符串?

import { Component } from '@angular/core';
import { TranslateService } from 'ng2-translate/ng2-translate';

@Component({
    template: `<span translate [translateParams]="{ value: countdown }">TIMEOUT</span>
        <span>{{ countdown }}</span>
        <span>{{ message }}</span>`
})
export class TimeoutComponent {
    countdown: number = 10;
    message: string;
    constructor(private translationService: TranslateService) {
        let intervalId = setInterval(() => {
            this.countdown--;
            if (this.countdown <= 0) { clearInterval(intervalId); }
            console.log(this.countdown);
            this.translationService.get('TIMEOUT', { value: this.countdown }).subscribe((result) => this.message = result);
         }, 500);
    }
}

上面的组件将静态显示Timeout in 10 seconds.,但第二个范围(和控制台)将显示您期望的减少值。

我解决此问题的方法(如上所示)是使用TranslationService在间隔的每个刻度上获取已翻译的字符串,并更新绑定的message属性模板中的组件。

0 个答案:

没有答案