找不到管道“翻译",在Ionic 4中显示错误 [英] The pipe 'translate' could not be found error is showing In Ionic 4
问题描述
我正在Ionic 4 App中工作,并且已经安装了ngx-translate
插件.在app.component.html
中工作正常,但在tabs.page.html
中显示错误.
I am working in my Ionic 4 App and I have installed the ngx-translate
plugin. It is working fine in app.component.html
but in tabs.page.html
it is showing the error.
找不到管道翻译"
The pipe 'translate' could not be found
这是我的 app.component.html :
<ion-list class="mylist22" color="myheader">
<ion-item color="myheader">
<ion-label>Gender</ion-label>
<ion-select [(ngModel)]="languageSelected" (ionChange)='setLanguage()'>
<ion-select-option value="en" selected>English</ion-select-option>
<ion-select-option value="ar">Arabic</ion-select-option>
</ion-select>
</ion-item>
</ion-list>
在此视图中,我具有语言选择框.
In this view, I have the language select box.
这是我的 app.component.ts :
import { TranslateService } from '@ngx-translate/core';
@Component({
selector: 'app-root',
templateUrl: 'app.component.html'
})
export class AppComponent {
languageSelected: any = 'en';
constructor(
private platform: Platform,
private splashScreen: SplashScreen,
private statusBar: StatusBar,
private translate: TranslateService
) {
this.translate.addLangs(['en', 'ar']);
this.translate.setDefaultLang('en');
this.initializeApp();
}
initializeApp() {
this.platform.ready().then(() => {
this.statusBar.styleDefault();
this.splashScreen.hide();
this.setLanguage();
});
}
setLanguage() {
const defaultLanguage = this.translate.getDefaultLang();
if (this.languageSelected) {
console.log(this.languageSelected);
this.translate.setDefaultLang(this.languageSelected);
this.translate.use(this.languageSelected);
} else {
this.languageSelected = defaultLanguage;
this.translate.use(defaultLanguage);
}
}
}
这是我的 app.module.ts :
import { TranslateModule, TranslateLoader } from '@ngx-translate/core';
import { TranslateHttpLoader } from '@ngx-translate/http-loader';
export function HttpLoaderFactory(httpClient: HttpClient) {
return new TranslateHttpLoader(httpClient, './assets/i18n/', '.json');
}
@NgModule({
imports: [
TranslateModule.forRoot({
loader: {
provide: TranslateLoader,
useFactory: HttpLoaderFactory,
deps: [HttpClient]
}
}) ],
})
在app.component.html
中,它可以正常工作,但是在tabs.pahe.html
中,它不能工作.
In the app.component.html
, it is working fine but in the tabs.pahe.html
it is not working.
这在 tabs.page.html 中:
<ion-label>{{ 'ACCOUNT_TAB_LAB' | translate }}</ion-label>
错误:找不到管道"translate".
Error: The pipe 'translate' could not be found.
非常感谢您的帮助.
推荐答案
您需要在要使用translate
管道的每个模块中导入TranslateModule
.
You need to import TranslateModule
in every module in which you want to use translate
pipe.
import { TranslateModule } from '@ngx-translate/core';
...
imports: [
TranslateModule // do not call forRoot from any module other than AppModule
]
...
这篇关于找不到管道“翻译",在Ionic 4中显示错误的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!