innerHTMLのスタイリング

Question

は、私は角度5.0.1およびNGX-変換/コア8.0.0

を使用してNGX-翻訳私はテンプレート

<p [innerHTML]="'privacyAgree'|translate:{href:'#'}"></p> 

とen.jsonで、この文字列

にこのコードを持っています

"privacyAgree": "Clicking «Registration» button, I accept<a href=\"{{href}}\">the terms</a>" 

と私の小さいファイルでこのコード

p{ 
    color: #8A8C8D; 
    font-size: 13px; 
    line-height: 1.4em; 
    a{ 
     color: #222222; 
    } 
} 

しかし、内側の色角度が

p[_ngcontent-c3] { 
    color: #8A8C8D; 
    font-size: 13px; 
    line-height: 1.4em; 
} 
p[_ngcontent-c3] a[_ngcontent-c3] { 
    color: #222222; 
} 

このスタイルを作成するが、

<p _ngcontent-c3="">Clicking «Registration» button, I accept<a href="#">the terms</a></p> 

このコードを作成し、「」タグが必要な属性を持っていないNGX-変換するので、「」は適用されません。

[innerHTML]テンプレートを翻訳後にレンダリングするにはどうすればよいですか？

Answer 1

コンポーネントのモードをEncapsulationに変更する必要があります。

この質問を確認してください。類似した問題があります。

Encapsulation