angular 2 ng2-translate custom TranslateLoader не работает с API

ng2-translate не работает с пользовательским TranslateLoader при получении данных из API. Ниже мой пользовательский TranslateLoader

перевестиCustomLoader.ts

@Injectable()
export class CustomTranslateLoader implements TranslateLoader  {

    constructor(private http: Http, private apiService: AuthHttp) { console.log("customer loader initialized"); }

    getTranslation(lang: string): Observable<any>{
        var apiAddress = "http://test.com/api/gettranslationsfromDB?culture=" + lang;

        return this.apiService.get(apiAddress).map((res) => res.json());

        //return Observable.of({ "hello": "translatedhello","welcome":"translatedwelcome"});
    }
}

Ответ от API

{ "hello": "translatedhello","welcome":"translatedwelcome"}

Добавлен TranslateLoader для поставщиков в app.module.ts.

providers: [CustomTranslateLoader, { provide: TranslateLoader, useClass: CustomTranslateLoader}]

На моей HTML-странице у меня есть ниже

<h4>{{ 'hello' | translate }}</h4>

Я все еще вижу, как hello отображается. Это отлично работает, если я заменяю

return this.apiService.get(apiAddress).map((res) => res.json());

с

return Observable.of({ "hello": "translatedhello","welcome":"translatedwelcome"});

Так что я почти уверен, что с конфигурацией все в порядке. Что мне здесь не хватает?


person Ravi A.    schedule 28.03.2017    source источник


Ответы (1)


Я заработал, изменив getTranslation, как показано ниже.

getTranslation(lang: string): Observable<any> {
    var apiAddress = "http://test.com/api/gettranslationsfromDB?culture=" + lang;
    return Observable.create(observer => {
            this.authService.get(apiAddress)
                .subscribe((res: Response) => {
                    observer.next(JSON.parse(res.json()));
                    observer.complete();               
                });
        });

    }

Хотя для меня особого смысла нет. Надеюсь, это поможет кому-то.

person Ravi A.    schedule 29.03.2017