2017-07-18 4 views
2

Ich muss den übersetzten Titel jeder Seite anzeigen.Übersetzte dynamische Seitentitel in Angular 2 mit Router-Ereignissen anzeigen

Ich habe oben Code implementiert und Übersetzung in subscribe() wie unten hinzugefügt:

import 'rxjs/add/operator/filter'; 
import 'rxjs/add/operator/map'; 
import 'rxjs/add/operator/mergeMap'; 

import { TranslateService } from '@ngx-translate/core'; 
import { Component, OnInit } from '@angular/core'; 
import { Router, NavigationEnd, ActivatedRoute } from '@angular/router'; 
import { Title } from '@angular/platform-browser'; 

@Component({...}) 
export class AppComponent implements OnInit { 
    constructor(
    private translate: TranslateService, 
    private router: Router, 
    private activatedRoute: ActivatedRoute, 
    private titleService: Title 
) {} 
ngOnInit() { 
    this.router.events 
     .filter((event) => event instanceof NavigationEnd) 
     .map(() => this.activatedRoute) 
     .map((route) => { 
     while (route.firstChild) route = route.firstChild; 
     return route; 
     }) 
    .filter((route) => route.outlet === 'primary') 
    .mergeMap((route) => route.data) 
    .subscribe((event) => this.titleService.setTitle(this.translate.instant(event['title'])); 
    } 
} 

und in Routing-Modul I Schlüssel für die Übersetzung als Titel am vorbei:

const routes: Routes = [ 
    { path: 'buildings', component : BuildingsComponent, data : {title : 'BUILDINGS' }} 
]; 

Es funktioniert gut in Normalfall. Bei der Seitenaktualisierung wird der Titel jedoch nicht übersetzt. Ich bekomme event['title'] in Abonnenten auf Seitenaktualisierung.

Ich bekomme nicht, wie man es repariert. Bitte helfen.

Thanks :)

Antwort

0

Es ist Sache der instant Methode der TranslateService von offiziellen Dokumente:

Zeitpunkt (Schlüssel: string | Array, interpolateParams ?: Object): string | Objekt: die Instant Ruft übersetzter Wert eines Schlüssels (oder eines Arrays von Schlüsseln). /! \ Diese Methode ist synchron und der Standard-Dateilader ist asynchron. Sie sind dafür verantwortlich zu wissen, wann Ihre Übersetzungen geladen wurden und es sicher ist, diese Methode zu verwenden. Wenn Sie nicht sicher sind, sollten Sie stattdessen die Methode get verwenden.

Verwandte Themen