Question

我在将角度2 RC5中的ng2-translate集成到与主应用程序不同的其他组件时遇到了一些麻烦。

我想全局使用管道，在研究中我发现可能我需要使用“提供者”（但是在RC4上），然后发现我需要使用“声明”。有任何想法吗？

一如既往......非常感谢你的帮助！

当我在模板文件中使用时，：

我在浏览器上收到此错误：

The pipe 'translate' could not be found ("<h1>title test</h1>
<h2>[ERROR ->]{{ 'HOME.TITLE' | translate }}</h2>

这是我的main.ts文件：

// The browser platform with a compiler
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

// The app module
import { AppModule } from './app.module';

// Compile and launch the module
platformBrowserDynamic().bootstrapModule(AppModule);

主模块文件：

import {TranslateModule, TranslateService} from "ng2-translate/ng2-translate";


@NgModule({
 imports: [
   BrowserModule,
   HttpModule,
   RouterModule.forRoot(routes),
   AboutModule,
   HomeModule,
   SharedModule.forRoot(),
   TranslateModule.forRoot()
  ],
 declarations: [AppComponent],
 providers: [{
    provide: APP_BASE_HREF,
    useValue: '<%= APP_BASE %>'
  }],
 bootstrap: [AppComponent]
})

export class AppModule { }

Answer 1

使用shared.module并导出TranslatePipe。

shared.module.ts

// libs

// libs
import { NgModule, ModuleWithProviders }       from '@angular/core';
import { CommonModule }   from '@angular/common';
import { TranslateModule, TranslatePipe } from 'ng2-translate/ng2-translate';

@NgModule({
    imports: [
        CommonModule,
        TranslateModule
    ],
    declarations: [

    ],
    exports: [
        CommonModule,
        TranslateModule,
        TranslatePipe
    ]
})
export class SharedModule {

    static forRoot(): ModuleWithProviders {
        return {
            ngModule: SharedModule
        };
    }
}

Answer 2

ng2-translate updated just after the release of RC5. You no longer need to do anything to use the translatePipe globally, it is included in the TranslateModule.

Answer 3

Are you initializing TranslateService as in the documentation?

constructor(translate: TranslateService) {
    // this language will be used as a fallback when a translation isn't found in the current language
    translate.setDefaultLang('en');

     // the lang to use, if the lang isn't available, it will use the current loader to get them
    translate.use('en');
}

Hope this helps!!

带有全局管道的Angular 2 RC5问题

{{'HOME.TITLE'|翻译}}

3 个答案: