代码之家 › 专栏 › 技术社区 › sosick

角度4-如何将模块导入子模块?

angular

2

sosick · 技术社区 · 6 年前

我在角度应用程序中使用ngx translate。我正在导入并完成app.module.ts中的所有操作:

import {HttpClientModule, HttpClient} from '@angular/common/http';
import {TranslateModule, TranslateLoader} from '@ngx-translate/core';
import {TranslateHttpLoader} from '@ngx-translate/http-loader';

export function HttpLoaderFactory(http: HttpClient) {
  return new TranslateHttpLoader(http, '/assets/i18n/', '.json');
 }

@NgModule({
imports: [
    BrowserModule,
    HttpClientModule,
    TranslateModule.forRoot({
        loader: {
            provide: TranslateLoader,
            useFactory: HttpLoaderFactory,
            deps: [HttpClient]
        }
    })
],
bootstrap: [AppComponent]

@NgModule({
imports: [
    BrowserModule,
    HttpClientModule,
    TranslateModule.forRoot({
        loader: {
            provide: TranslateLoader,
            useFactory: HttpLoaderFactory,
            deps: [HttpClient]
        }
    })
],
bootstrap: [AppComponent]

我正在导入和导出模块,如github ngx translate页面上的示例。翻译工作很好。

但我有一个子文件夹,它有自己的module.ts文件pages.module.ts。当我想使用ngx翻译网页文件夹中的html文件,我有信息,翻译管道是不承认在这个应用程序。我想我需要将元素从app.module.ts导入pages.module.ts。我试过了,但我不知道怎么做。

2 回复 | 直到 4 年前

1

9

Phix 5 年前

很可能你必须使用 TranslateModule.forChild (代替 TranslateModule.forRoot pages.module.ts

在子模块中,使用“extend”=true从根模块获取设置

TranslateModule.forChild({
  extend: true
})

2

0

kuebano 6 年前

创建共享模块文件(shared.module.ts)

import {HttpClient} from '@angular/common/http';
import {TranslateModule, TranslateLoader} from '@ngx-translate/core';
import {TranslateHttpLoader} from '@ngx-translate/http-loader';

export function HttpLoaderFactory(http: HttpClient) {
  return new TranslateHttpLoader(http, '/assets/i18n/', '.json');
 }

@NgModule({
imports: [
TranslateModule.forRoot({
    loader: {
        provide: TranslateLoader,
        useFactory: HttpLoaderFactory,
        deps: [HttpClient]
    }
})
], export: [TranslateModule]

然后将共享模块导入到要在其中使用Translate服务的任何其他模块中。