Angular2動態管

Question

我使用的是管道走向國際化我的應用程序：

import {Pipe, PipeTransform} from '@angular/core'; 
import {I18nService} from './i18n.service'; 

@Pipe({ 
    name: 'i18n' 
}) 
export class I18nPipe implements PipeTransform { 

    constructor(private i18nService: I18nService) { 
    } 

    transform(value: any, args?: any): any { 
    return this.i18nService.get(value); 
    } 

} 

這條管道調用服務：

import {Injectable} from '@angular/core'; 

const i18n = { 
    en: { 
    hello: 'Hello' 
    }, 
    fr: { 
    hello: 'Salut' 
    } 
}; 

@Injectable() 
export class I18nService { 

    language: string = 'en'; 

    constructor() { 
    } 

    get(key: string) { 
    let languageObject = i18n[this.language]; 
    return languageObject[key]; 
    } 

} 

在組件我用這樣的：

<div (click)="switchLanguage()">{{'hello' | i18n}}</div> 

switchLanguage() { 
    this.i18nService.language = 'en' ? 'en' : 'fr'; 
} 

但是，即使服務語言值已更改，管道結果也不會重新評估。我需要導航到任何其他路線，然後回過頭來查看此更改。

我嘗試了ApplicationRef.tick（）和NgZone.run（回調），沒有任何運氣。

有關如何重新評估應用程序的每個管道而不導航到其他路線或重新加載頁面的任何想法？

感謝

Answer 1

你管應標記爲不純正，因爲雖然輸入並沒有改變其對於給定的輸入轉換的結果甚至可以改變。

查看the documentation的解釋。

@Pipe({ 
    name: 'i18n', 
    pure: false 
})