如何解决翻译模块角度10找不到管道“翻译”
这是app.module.ts
import { NgModule } from '@angular/core';
import { browserModule } from '@angular/platform-browser';
import { HttpClient,HttpClientModule } from '@angular/common/http';
import { RouterModule,Routes } from '@angular/router';
import { AppComponent } from './app.component';
import { TranslateLoader,TranslateModule } from '@ngx-translate/core';
import { TranslateHttpLoader } from '@ngx-translate/http-loader';
import {CommonModule} from "@angular/common";
export function HttpLoaderFactory(httpClient: HttpClient) {
return new TranslateHttpLoader(httpClient);
}
@NgModule({
declarations: [
AppComponent
],imports: [
browserModule,HttpClientModule,RouterModule.forRoot(appRoutes),CommonModule,TranslateModule.forRoot({
loader: {
provide: TranslateLoader,useFactory: HttpLoaderFactory,deps: [HttpClient]
}
})
],bootstrap: [
AppComponent
]
})
export class AppModule {
}
这是toolbar.component.html
,我在这里使用翻译。
<span>{{'shared.settings' | translate}}</span>
在toolbar.component.ts
我导入的
import { TranslateService } from '@ngx-translate/core';
我不知道为什么,我遇到了这个错误(我使用的是Angular 10)
解决方法
您必须在声明为TranslateModule
的任何forRoot()
中导入NgModule
(而不是ToolbarComponent
)。因此,例如,如果在其自己的模块中声明了它,则必须执行以下操作。否则,该组件将无法访问管道:
@NgModule({
imports: [
TranslateModule
],declarations: [
ToolbarComponent
],exports: [
ToolbarComponent
]
})
export class ToolbarModule {}
或者,如果您使用在多个其他功能模块中导入的SharedModule
(通常的做法),则可以导出TranslateModule
以确保不必在每个模块中都将其导入
@NgModule({
exports: [
CommonModule,TranslateModule
]
})
export class SharedModule {}
,
有时重新启动 IDE 可能会有所帮助。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。