Problem on Angular 2 RC5 with global pipes

Question

I am having trouble integrating ng2-translate into angular 2 RC5 for components other than the main application.

I want to use the handset globally, and during the research I found that I probably need to use a “provider” (but this is on RC4), and then I found that I need to use “ads”. Any ideas?

As always ... thank you very much for your help!

When I use in the template file:   

{{'HOME.TITLE' | translate}}

I get this error in the browser:

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

This is my main.ts file:

// 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);

The main module file:

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

Use shared.module and export 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
        };
    }
}

Hide result

Answer 2

ng2-translate RC5. , translatePipe , TranslateModule.

Answer 3

Do you initialize TranslateServiceas 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!