Angular: No pipe 'translate' was found

Question

I need to use the translate pipe in my project. In my app.module, I have:

@NgModule({
  declarations: [
    AppComponent,
 

  ],
  imports: [
    BrowserModule,
    FontAwesomeModule,
    FormsModule,
    TranslateModule.forRoot({
      loader: {
          provide: TranslateLoader,
          useFactory: createTranslateLoader,
          deps: [HttpClient]
      }
      
  }), // .forRoot(),
  TranslateModule
  
    
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

export function createTranslateLoader(http: HttpClient) {
  return new TranslateHttpLoader(http, './languages/', '.json');
}

But in my app-component (and every child where I have this) where I try use the translate pipe:

 <div id="port_header">
            <a id="portal-logo-header" title="{{ 'APPLICATION.FRONT_OFFICE.HEADER.HOME' | translate }}">
                <img src=" alt="">
            </a>

I get No pipe found with name 'translate'. Can anyone help me?