如何在模块组件中使用 ngx-translate？

Question

我正在研究 ngx-translate。正如几乎教程所描述的那样，我将其用于 app.component.html。但是如何在我的模块的组件中做到这一点？我是否拥有每个模块的所有步骤，还是有更简单的方法？如果我将所有步骤从 app.module.ts 带到 my.module.ts，我在运行ning ng serve.

上收到一条错误消息

ERROR in src/app/landing-page/home/home.component.html:4:22 - error NG8004: No pipe found with name 'translate'.

这是我的 home.component.ts:

import { Component, OnInit } from '@angular/core';
import { TranslateService } from '@ngx-translate/core';

@Component({
  selector: 'app-home',
  templateUrl: './home.component.html',
  styleUrls: ['./home.component.scss']
})
export class HomeComponent implements OnInit {
  
  constructor(private translateServeice: TranslateService) { }

  ngOnInit(): void {
  }

}

这是我的landingpage.module.ts

  import { NgModule } from '@angular/core';
    import { CommonModule } from '@angular/common';
    import { HomeComponent } from './home/home.component';
    import { TranslateLoader, TranslateModule, TranslateService } from '@ngx-translate/core';
    import { HttpClient, HttpClientModule } from '@angular/common/http';
    import { TranslateHttpLoader } from '@ngx-translate/http-loader';
    
    export function createTranslateLoader(http: HttpClient) {
      return new TranslateHttpLoader(http, './assets/i18n/', '.json');
    }
    
    @NgModule({
      declarations: [
        HomeComponent
      ],
      imports: [
        CommonModule,
        HttpClientModule,
        TranslateModule.forChild(
          {
            loader: {
              provide: TranslateLoader,
              useFactory: (createTranslateLoader),
              deps: [HttpClient]
            },
          }
        )
        
      ],
      exports: [
        HomeComponent
      ]
    })
    export class LandingPageModule { }

我是否遗漏了模块中的任何引用，或者我这样做的方式有误？

通常在模块组件中使用 ngx-translate 的方式是什么？

[编辑]

这是我的演示项目：https://github.com/Christoph1972/angular-i18n-demo

有人可以告诉我如何运行吗？

Answer 1

只需将 TranslateModule 添加到组件模块的导入中

或使 SharedTranslateModule 谁 import 和 export TranslateModule 和 添加到 app.module.ts 导入

成功了stackblitz

如何在模块组件中使用 ngx-translate？

How to use ngx-translate in module components?

ngx-translate

angular