angular - Varför kunde inte pipen 'translate' hittas?

Jag skapade en komponent cookie.component i modal/-mappen med component.module som innehåller det nödvändiga för att få modulöversättningen att fungera

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
        ) {
      }
 }

Jag importerar denna komponent i en guard/cookie.guard som jag kallade i 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);
        });
    }
}

och här är 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 { }

Jag får The pipe 'translation' could not be found även om modulen cookie.component har de nödvändiga importerade...

Har du någon idé om hur man gör översättningen i det här specifika fallet?

Målet för mig är att ha en modal som har en guard med översättningen, notera att om jag ersätter i cookie.component.html {{ELEMENT.el | translate }} med vanlig icke-översatt text så fungerar det bra. Och översättningen fungerar på alla andra sidor.

Svar #1

Du behöver imports: [TranslateModule] i den modul där CookiesGuard är deklarerad.