2017-07-24 27 views
1

我是從服務器在我app.module.ts這樣使用TranslateHttpLoader加載翻譯文件:Ionic3/NRX個 - 翻譯 - TranslateHttpLoader與外部URL

export function createTranslateLoader(http: Http) { 
    return new TranslateHttpLoader(http, AppConfig.API_URL+'/static/i18n/', '.json'); 
} 

@NgModule({ 
    ... 

    imports: [ 

    TranslateModule.forRoot({ 
     loader: { 
     provide: TranslateLoader, 
     useFactory: (createTranslateLoader), 
     deps: [Http] 
     } 
    }), 

    ], 
    ... 
}) 

一切工作正常,但我想知道當加載程序因爲什麼原因(服務器問題,網絡連接等)無法檢索語言文件時是否有辦法捕獲事件,並可能使用某些默認轉換字符串加載本地json文件?

我想抓住這個事件,如果第一次加載的應用程序無法抓住語言文件,並回退到最小的本地json文件,只顯示翻譯的mainetnance頁面/錯誤頁面或其他東西。

回答

0

末我寫道,解決了要求定製裝載機:

import { Injectable } from '@angular/core'; 
import { Headers, Http, Response } from "@angular/http"; 
import { TranslateLoader } from '@ngx-translate/core'; 
import { AppConfig } from "./config" 
import { Observable } from 'rxjs/Observable'; 


@Injectable() 
export class CustomTranslateLoader implements TranslateLoader { 
    contentHeader = new Headers({"Content-Type": "application/json","Access-Control-Allow-Origin":"*"}); 

    constructor(private http: Http) {} 
    getTranslation(lang: string): Observable<any>{ 
     var apiAddress = AppConfig.API_URL+"/static/i18n/"+ lang+".json"; 
     return Observable.create(observer => { 
      this.http.get(apiAddress, { headers: this.contentHeader }).subscribe((res: Response) => { 
        observer.next(res.json()); 
        observer.complete();    
       }, 
      error => { 
       // failed to retrieve from api, switch to local 
       this.http.get("/assets/i18n/en.json").subscribe((res: Response) => { 
        observer.next(res.json()); 
        observer.complete();    
       }) 
      } 
      ); 
     }); 
    } 
} 

和app.module.ts

... 
import { CustomTranslateLoader } from "../services/trans-loader" 
... 

@NgModule({ 
    ... 

    imports: [ 

    TranslateModule.forRoot({ 
     loader: { 
     provide: TranslateLoader, 
     useClass: CustomTranslateLoader, 
     deps: [Http] 
     } 
    }), 

    ], 
    ... 
})