ngx-translateはサーバモードで翻訳を表示しません

ngx-translationに問題があります。両方のモードで動作します - ブラウザ&サーバ。ブラウザモードではすべて正常に動作しますが、サーバーモードではHTMLソースファイルが変換されません。 ngx-translateはサーバモードで翻訳を表示しません

は、私はこの問題は私のローダーであると考えた - Iユーザーの@ NGX-ユニバーサル/翻訳・ローダーが、私は私のコンストラクタで translate.getを追加するときに、それをテストするために、それが正常に動作します：

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

この番組aをノードコンソール（ "en"モードでは " - WORKS"、研磨モードでは " - DZIALA"）になるので、テンプレートがレンダリングされるときに問題が発生します。

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>

テキストは、例えばワード "TEXT：" のために（私のHTMLソースファイルで適切に示されているか、「PL 」、 "EN" が、TEXT後routerLink上の翻訳と単語：表示されませんソースは次のようになります。。

<!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>

出典

2017-10-21 kris_IV

翻訳サービスのパイプを定義するだけで、文字列をデータバインドできるようにするのはなぜですか？結果は '{{'some_string' |翻訳する}} ' –

ありがとうございます - それは正常に動作しています。なぜ説明できますか？私が見つけたのは、 '

'と '

'ですが、 ''は動作しません。 –

私はタイミング問題だと思っています。たとえば、ファイルがロードされる前に翻訳を実行しようとしているか、サービスが準備完了です。パイプを定義すると、そのパイプが周囲に広がります。 –

なぜDEFIありませんあなたはそれに文字列を単にデータバインドすることができますような翻訳サービスのためのパイプ？結果は{{'some_string' | translate}}

出典

2017-10-21 12:59:43

ngx-translateはサーバモードで翻訳を表示しません

答えて

関連する問題