简体   繁体   English

Angular 4 - '.ts' 文件中文本的离子 3 翻译

[英]Angular 4 - ionic 3 translation of text inside '.ts' file

I want to know how translate text in '.ts' file我想知道如何翻译“.ts”文件中的文本
basically it's a loading text基本上它是一个加载文本

showLoader() { 
this.loading = this.loadingCtrl.create({
  content: 'Loading...'
});
this.loading.present();

  }

what I need is to text "Loading..." translated to "Chargement..." When language is set to french当语言设置为法语时,我需要将文本“加载中...”翻译为“收费...”
thanks谢谢

You can do it like below:你可以像下面这样做:

Note: I extracted this from my working code base.So please adjust as you wish.注意:我从我的工作代码库中提取了它。所以请根据需要进行调整。 If you need further help please let me know.如果您需要进一步的帮助,请告诉我。

presentLoader(): Loading {
    this.translate.get('Please_wait').subscribe(res => {
      this.content = res;
    });
    let loader = this.loadingCtrl.create({
      content: this.content
    });
    loader.present();
    return loader;
  }

@Sampath's answer works perfectly but still, I wanted to add another way to do it, returning a Promise . @Sampath 的答案完美无缺,但我仍然想添加另一种方法来做到这一点,返回一个Promise

Since the get method is async, I'd prefer to create the Loading when the translation is ready, instead of creating it and then updating the reference to the content.由于get方法是异步的,我更喜欢在翻译准备好时创建Loading ,而不是创建它然后更新对内容的引用。

// Imports
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/toPromise';

// ...

presentLoader(translationKey: string): Promise<Loading> {
    return this.translate.get(translationKey)
            .toPromise()
            .then(translation => {

                // Create the loader
                let loader = this.loadingCtrl.create({
                    content: translation
                });

                // Present the loader
                loader.present();

                // Return the loader
                return loader;
            });
}

And you can use that method like this:您可以像这样使用该方法:

this.presentLoader('Please_wait').then((loader: Loading) => {
    // This code is executed after the loading has been presented...
    // ... You can use the loader property to hide the loader
});

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM