NG2-翻译不工作

我一直在试图用在我的项目NG2-翻译得到的多语言支持，但它提供了一些错误，如下面
 NG2-翻译不工作

这里是我的app.module.ts

import { NgModule } from '@angular/core';<br> 
import { RouterModule } from '@angular/router';<br> 
import { FormsModule, FormBuilder, FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms';<br> 
import { HttpModule } from '@angular/http';<br> 
import { BrowserModule } from '@angular/platform-browser';<br> 
import { TranslateModule } from 'ng2-translate';<br> 

@NgModule({ 
imports: [ 
    BrowserModule, 
    HttpModule, 
    FormsModule, 
    ReactiveFormsModule, 
    TranslateModule.forRoot(), 
    RouterModule.forRoot([ 
     { path: '', component: HomeComponent }, 
     { path: 'employee', component: EmployeeComponent }, 
     { path: 'Home/Employees', component: EmployeeComponent }, 



    ]) 
], 

providers: [], 
declarations: [AppComponent, EmployeeComponent, HomeComponent, NavigationBarComponent, NavigationBarItemsComponent, GridComponent, TenantComponent], 
bootstrap: [AppComponent],})export class AppModule { }

Systemjs.config.js

var map = { 
    'app': '/app', 
    '@angular': '/node_modules/@angular', 
    'angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api', 
    'ng2-translate': 'node_modules/ng2-translate', 
    'rxjs': '/node_modules/rxjs' 
}, 
    packages = { 
     'app': { main: './main.js', defaultExtension: 'js' }, 
     'angular2-in-memory-web-api': { main: './index.js', defaultExtension: 'js' }, 
     'rxjs': { defaultExtension: 'js' }, 
     'ng2-translate': { main: './index.js', defaultExtension: 'js' } 
    }, 
    ngPackageNames = [ 
     'common', 
     'compiler', 
     'core', 
     'http', 
     'platform-browser', 
     'platform-browser-dynamic', 
     'router', 
     'forms' 
    ];

app.component。 JS

import { Component } from '@angular/core'; 

import { TranslateService } from 'ng2-translate'; 


@Component({ 
    selector: 'my-app', 
    templateUrl: 'app/app.component.html' 
}) 
export class AppComponent { 
    constructor(private translate: TranslateService) 
    { 
     translate.addLangs(["en", "fr", "cn", "ru", "es"]); 
     translate.setDefaultLang("en"); 
     let browserLang = translate.getBrowserCultureLang(); 
     translate.use(browserLang.match(/en|fr|cn|ru|es/) ? browserLang:"en"); 
    } 
}

任何人都可以指导我哪里出了问题..

在此先感谢。

来源

2017-08-14 Natarajan Nagarajugari

我猜错误显示必须有你的应用程序 –

不知道你正在使用的版本缺少一些依赖，但如果它的最新版本[NGX-翻译（https://github.com/ngx-translate/core），你可以看看这个【答案】（https://stackoverflow.com/a/45380000/5556177） – Nehal

我使用Angular 2 –

我做了一些改动，以我的代码，它现在正在工作。

Here is my updated app.module.ts 
import { NgModule } from '@angular/core'; 
import { RouterModule } from '@angular/router'; 
import { FormsModule, FormBuilder, FormControl, FormGroup, 
ReactiveFormsModule } from '@angular/forms'; 
import { HttpModule } from '@angular/http'; 
import { BrowserModule } from '@angular/platform-browser'; 

import { AppComponent } from './app.component'; 
import { GridComponent } from './grid.component'; 
import { TenantComponent } from './Tenant/tenant.component'; 
import { NavigationBarComponent } from './Home/navigationBar.component'; 
import { NavigationBarItemsComponent } from 
'./Home/navigationBarItems.component'; 
import { TenantSwitchingComponent } from './Home/tenantswitching.component'; 

import { EmployeeComponent } from './Employee/employee.component'; 
import { HomeComponent } from './Home/home.component'; 
import { Http, Response, Headers, RequestOptions } from '@angular/http'; 
import { TranslateModule, TranslateLoader, 
TranslateService,TranslateStaticLoader } from 'ng2-translate'; 


@NgModule({ 
imports: [ 
    BrowserModule, 
    HttpModule, 
    FormsModule, 
    ReactiveFormsModule, 

    RouterModule.forRoot([ 
     { path: '', component: HomeComponent }, 
     { path: 'employee', component: EmployeeComponent }, 
     { path: 'Home/Employees', component: EmployeeComponent } 


    ]), 
    TranslateModule.forRoot({ 
     provide: TranslateLoader, 
     useFactory: (http: Http) => new TranslateStaticLoader(http, 'app/i18n', '.json'), 
     deps: [Http] 
    }) 
], 

providers: [], 
declarations: [AppComponent, EmployeeComponent, HomeComponent, NavigationBarComponent, NavigationBarItemsComponent, GridComponent, TenantComponent, TenantSwitchingComponent, LogoComponent], 
bootstrap: [AppComponent, TenantSwitchingComponent, LogoComponent, NavigationBarComponent], 

    }) 
    export class AppModule { 

    }

这里是我的Systemjs.config.js

var map = { 
    'app': '/app', 
    '@angular': '/node_modules/@angular', 
    'angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api', 
    'ng2-translate': 'node_modules/ng2-translate/bundles', 
    'rxjs': '/node_modules/rxjs' 
}, 

    packages = { 
     'app': { main: './main.js', defaultExtension: 'js' }, 
     'angular2-in-memory-web-api': { main: './index.js', defaultExtension: 'js' }, 
     'rxjs': { defaultExtension: 'js' }, 

     "ng2-translate": { main: 'index.js', "defaultExtension": "js" } 
    },

来源

2017-09-07 09:55:15

NG2-翻译不工作

回答

相关问题