为什么找不到管道“翻译”？

Question

我在modal/ 文件夹中创建了一个组件cookie.component，其中包含使模块翻译工作所需的component.module

cookie.component.module

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { IonicModule } from '@ionic/angular';
import { TranslateModule } from '@ngx-translate/core';
import { FaIconLibrary, FontAwesomeModule } from '@fortawesome/angular-fontawesome';

@NgModule({
    imports: [
        CommonModule,
        IonicModule,
        TranslateModule.forChild(),
        FontAwesomeModule,
    ],
    declarations: [],
    exports: []
})
export class CookieModule {
    constructor(
        private library: FaIconLibrary
        ) {
      }
 }

我在guard/cookie.guard 中导入了这个组件，我在app-routing.module 中调用了它

guard/cookie.guard

import { Injectable } from '@angular/core';
import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
import { Observable } from 'rxjs';
import { ModalController, Platform } from '@ionic/angular';
import { CookieComponent } from '../modal/cookie/cookie.component';

@Injectable({
    providedIn: 'root'
})
export class CookiesGuard implements CanActivate {
    constructor(
        private modalController: ModalController,
        private platform: Platform
    ) {}

    canActivate(
        next: ActivatedRouteSnapshot,
        state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {
        return new Promise(async resolve => {
            if (this.platform.url().includes("http") && localStorage.getItem("useAnalytics") == null) {
                this.modalController.create({
                    component: CookieComponent,
                    cssClass: "cookie-modal",
                    backdropDismiss: false
                }).then(m => {
                    m.present();
                }).catch(err => console.error(err));
            } else resolve(true);
        });
    }
}

这里是app-routing.module

...
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { TranslateModule } from '@ngx-translate/core';
import { CookiesGuard } from './guard/cookie.guard';

const routes: Routes = [
  {
    path: 'home',
    loadChildren: () => import('./home/home.module').then(m => m.HomePageModule),
    canActivate: [CookiesGuard, LaunchGuard, ProgramChoseGuard]
  },
...
];

@NgModule({
  imports: [
    CommonModule,
    TranslateModule.forChild(),
    RouterModule.forRoot(routes, {
      preloadingStrategy: PreloadAllModules,
      useHash: true
    })
  ],
  exports: [RouterModule]
})
export class AppRoutingModule { }

我得到了The pipe 'translation' could not be found，即使模态cookie.component 具有必要的导入...

知道如何在这种特定情况下进行翻译吗？

我的目标是让模态有一个带有翻译的守卫，请注意，如果我在 cookie.component.html 中替换 {{ELEMENT.el |用普通的非翻译文本翻译 }} 效果很好。并且翻译适用于所有其他页面。

Answer 1

您需要将imports: [TranslateModule] 加入到声明CookiesGuard 的任何模块中。