#angular #angular-pipe #ngx-translate
#angular #angular-pipe #ngx-перевести
Вопрос:
это 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
здесь я использую translation.
<span>{{'shared.settings' | translate}}</span>
В toolbar.component.ts
я импортировал
import { TranslateService } from '@ngx-translate/core';
Я не знаю почему, я получил эту ошибку (я использую Angular 10)
ОШИБКА Ошибка: не удалось найти канал «translate»!
Ответ №1:
Вы должны импортировать TranslateModule
(не с forRoot()
) в любом NgModule
ToolbarComponent
объявленном. Так, например, если он объявлен в своем собственном модуле, вам нужно будет сделать следующее. В противном случае компонент не имеет доступа к каналу:
@NgModule({
imports: [
TranslateModule
],
declarations: [
ToolbarComponent
],
exports: [
ToolbarComponent
]
})
export class ToolbarModule {}
Или, если вы используете a SharedModule
, который вы импортируете в несколько других функциональных модулей, что является обычной практикой, вы можете экспортировать TranslateModule
, чтобы убедиться, что вам не нужно импортировать его в каждый модуль.
@NgModule({
exports: [
CommonModule,
TranslateModule
]
})
export class SharedModule {}
Комментарии:
1. Я внес предложенные изменения, но всегда получаю одну и ту же ошибку
2. я решил добавить
"angularCompilerOptions": { "enableIvy": false }
вtsconfig.json
3. У меня та же проблема, я перехожу с Angular4 на Angular12
Ответ №2:
Иногда может помочь перезапуск IDE.
Ответ №3:
Этот метод сработал для меня:-
добавьте «angularCompilerOptions»: { «enableIvy»: false } в tsconfig.json