ngx-translate n'affiche pas la traduction en mode serveur

J'ai un problème avec la traduction ngx. Il fonctionne dans les deux modes - navigateur & serveur. En mode navigateur, tout fonctionne correctement, mais en mode serveur, la traduction ne remplit pas le fichier source HTML.ngx-translate n'affiche pas la traduction en mode serveur

Je pensais qu'un problème est mon chargeur - je user @ NGX universel/translate-chargeur, mais quand j'ajoute translate.get dans mon constructeur pour le tester et il fonctionne correctement:

translate.get('works', {}).subscribe((res: string) => { 
    console.log(res); 
});

Ce spectacle a résultat dans la console du nœud ("- WORKS" en mode "en" ou "- DZIALA" en mode polonais), donc le problème est lorsque le modèle est rendu.

app.component.ts

import {Component, OnInit} from '@angular/core'; 
import {TranslateService} from '@ngx-translate/core'; 

@Component({ 
    selector: 'app-root', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.css'] 
}) 
export class AppComponent implements OnInit { 
    title = 'app'; 

    constructor(public translate: TranslateService) { 
    translate.setDefaultLang('en'); 
    translate.use('en'); 

    translate.get('works', {}).subscribe((res: string) => { 
     console.log(res); 
    }); 
    } 

    ngOnInit() { 
    } 

    swtitchLang(lang: string) { 
    this.translate.use(lang); 
    } 
}

app.component.html

<button (click)="swtitchLang('pl')">PL</button> 
<button (click)="swtitchLang('en')">EN</button> 

<ul> 
    <li><a routerLink="/" [translate]="'menu.home'"></a></li> 
    <li><a routerLink="about" [translate]="'menu.about'"></a></li> 
</ul> 
<h4>TEXT: <span [translate]="'works'"></span></h4> 

<router-outlet></router-outlet>

texte sans traduction est affichée correctement dans mon fichier HTML (par exemple mot "TEXT:" ou « PL », "eN", mais la traduction sur routerLink et mot après TEXTE: ne montre pas l'air Source comme ceci:.

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
     <meta charset="utf-8"> 
     <title>My Home</title> 
     <base href="/"> 
     <meta name="viewport" content="width=device-width,initial-scale=1"> 
     <link rel="icon" type="image/x-icon" href="favicon.ico"> 
     <link href="styles.d41d8cd98f00b204e980.bundle.css" rel="stylesheet"> 
     <style ng-transition="ang4-seo-pre"></style> 
     <meta name="author" content="Coursetro.com"> 
     <meta name="keywords" content="angular seo, angular 4 universal, etc"> 
     <meta name="description" content="This is my Angular SEO-based App, enjoy it!"> 
    </head> 
    <body> 
     <app-root _nghost-c0="" ng-version="4.4.6"> 
      <button _ngcontent-c0="">PL</button> 
      <button _ngcontent-c0="">EN</button> 
      <ul _ngcontent-c0=""> 
       <li _ngcontent-c0=""> 
        <a _ngcontent-c0="" routerLink="/" href="/"></a> 
       </li> 
       <li _ngcontent-c0=""> 
        <a _ngcontent-c0="" routerLink="about" href="/about"></a> 
       </li> 
      </ul> 
      <h4 _ngcontent-c0="">TEXT: 
       <span _ngcontent-c0=""></span> 
      </h4> 
      <router-outlet _ngcontent-c0=""></router-outlet> 
     </app-root> 
     <script type="text/javascript" src="inline.3df9f7567cf0da6bbb0f.bundle.js"></script> 
     <script type="text/javascript" src="polyfills.14173651b8ae6311a4b5.bundle.js"></script> 
     <script type="text/javascript" src="vendor.aeb6cf8ce8b6e01353e0.bundle.js"></script> 
     <script type="text/javascript" src="main.203dfaf526cd10912720.bundle.js"></script> 
    </body> 
</html>

Source

2017-10-21 kris_IV

Pourquoi ne pas définir un canal pour votre service de traduction de telle sorte que vous puissiez simplement lui assigner la chaîne? Le résultat serait '{{'some_string' | traduire}} ' –

Merci - cela fonctionne correctement. Pouvez-vous expliquer pourquoi? J'ai trouvé, que '

' et '

' fonctionnent, mais '' ne fonctionne pas. –

Je pense que c'est un problème de timing. Par exemple, un cas où vous essayez de faire la traduction avant que les fichiers aient été chargés ou que le service soit prêt. Définir un tuyau le contourne. –

Pourquoi ne pas DEFI ne un tuyau pour votre service de traduction de telle sorte que vous pouvez simplement lui assigner la chaîne? Le résultat serait {{'some_string' | translate}}

Source

2017-10-21 12:59:43

ngx-translate n'affiche pas la traduction en mode serveur

Répondre

Questions connexes