无法使用ng2-translate在Nativescript / Angular应用程序中播放球

时间:2017-11-19 20:38:58

标签: angular nativescript ng2-translate

我正在尝试使用国际化构建Nativescript / Angular应用程序。我研究了我的选项,发现ng2-translate应该与nativescript-ng2-translate一起完成,它应该处理翻译文件的加载。

但是,这似乎不起作用。我创建了一个示例项目,它具有与我自己的项目相同的基本结构。它是标签模板中的沼泽标准nativescript / angular项目构建。

翻译管道从不做任何事情。直接调用翻译服务也不会产生任何结果。我做错了什么?

代码在这里:https://github.com/JuergenSimon/translation-test

2 个答案:

答案 0 :(得分:1)

我使用nativescript-ng2-translate插件以及ngx-translate进行了大量的敲击,但无法使其中任何一个工作。使用ng2-translate和NativeScript http模块似乎是现在唯一有效的方法,至少它对我有用。我提到this让它发挥作用。希望它能帮到你!

答案 1 :(得分:0)

实际上我终于让它上班了。我缺少的是在app.component.ts中设置默认语言。所以最终看起来像这样:

app.module.ts:

import { NgModule, NgModuleFactoryLoader, NO_ERRORS_SCHEMA } from "@angular/core";
import { NativeScriptModule } from "nativescript-angular/nativescript.module";
import { NSModuleFactoryLoader } from "nativescript-angular/router";

import { AppRoutingModule } from "./app-routing.module";
import { AppComponent } from "./app.component";
import { TranslateModule, TranslateLoader, TranslateService } from "ng2-translate";
import { TNSTranslateLoader } from "nativescript-ng2-translate";

@NgModule({
    bootstrap: [
        AppComponent
    ],
    imports: [
        NativeScriptModule,
        AppRoutingModule,
        TranslateModule.forRoot({
            provide: TranslateLoader,
            useFactory: () => new TNSTranslateLoader("/assets/i18n")
        })
    ],
    exports: [
        TranslateModule
    ],
    declarations: [
        AppComponent
    ],
    providers: [
        {provide: NgModuleFactoryLoader, useClass: NSModuleFactoryLoader},
        TranslateService
    ],
    schemas: [
        NO_ERRORS_SCHEMA
    ]
})
export class AppModule {
}

然后在 tabs.module.ts 中再次导入TranslateModule:

import { NgModule, NO_ERRORS_SCHEMA } from "@angular/core";
import { NativeScriptModule } from "nativescript-angular/nativescript.module";

import { BrowseComponent } from "./browse/browse.component";
import { HomeComponent } from "./home/home.component";
import { SearchComponent } from "./search/search.component";
import { TabsRoutingModule } from "./tabs-routing.module";
import { TabsComponent } from "./tabs.component";
import { TranslateModule, TranslateLoader } from "ng2-translate";
import { TNSTranslateLoader } from "nativescript-ng2-translate";

@NgModule({
    imports: [
        NativeScriptModule,
        TabsRoutingModule,
        TranslateModule
    ],
    declarations: [
        TabsComponent,
        HomeComponent,
        BrowseComponent,
        SearchComponent
    ],
    schemas: [
        NO_ERRORS_SCHEMA
    ]
})
export class TabsModule {
}

并在 tabs.component.ts中设置默认语言:

import { Component, OnInit } from "@angular/core";
import { isAndroid } from "platform";
import { SelectedIndexChangedEventData, TabView, TabViewItem } from "tns-core-modules/ui/tab-view";
import { TranslateService } from "ng2-translate";

@Component({
    selector: "TabsComponent",
    moduleId: module.id,
    templateUrl: "./tabs.component.html",
    styleUrls: ["./tabs.component.css"]
})
export class TabsComponent implements OnInit {
    private _title: string;

    constructor(private translate: TranslateService) {
        translate.setDefaultLang('en');
    }
    ...

最后一步也可能在apps.component.ts中完成。之后,管道和翻译服务工作正常。