Pipe not working with ngIf

I have an app that is using globalization plugin to get user preferred language and show the translation for menu.
It is working ok if I do not use *ngIf, otherwise it will not get the correct word for it.

My translation provider

        return new Promise<boolean>((resolve, reject) => {

            this.platform.ready().then(() => {
                this.globalization.getPreferredLanguage().then(data => {
                    //If not found get the default language
                    let language = 'pt';
                    //Otherwise get the language json file
                    if(data.value) {
                        for(let item of this._languages){
                            language = item;

                    .subscribe(res => {
                        let body = res;

My pipe

    name: 'idioma',
    pure: false

export class TranslatePipe implements PipeTransform {
    public text: string = 'Text not found';

    constructor(private translate: TranslateProvider){}

    transform(key: string) : string{
        this.translate.onChange.subscribe(texts => {
            this.text = texts[key];

        return this.text;


When I use a *ngIf I only got “Text not found”… Don’t know why it is happening.
Example: <h2 *ngIf=“condition”>{{ ‘TRANSLATION’ | idioma }}

I would recommend using ngx-translate instead of trying to reinvent it.

Hi, thanks for the tip.
I didn’t know ngx-translate… far easier.