親スタイルを子にバインドするAngular2

子コンポーネントのCSSクラスに親のtemplateUrls cssで定義されたCSSクラスに関連付けられたCSSスタイルを渡すことはできますか？親スタイルを子にバインドするAngular2

ような何か：

<parent-component> 
    <child-component [class.child-class]="class.parent-class"></child-component> 
</parent-component>

は、今私は私が子供の<div>に持っているCSSクラスに親のCSSで/deep/を使用していますが、私は、ハード子でコード化されたものに私の両親のCSSクラス名を限定するものではないたいと思います。

出典

2017-05-19 Ricevind

子コンポーネントの '@ Input'を介してクラス名を渡し、必要に応じて使用することを検討しましたか？ –

私はそれについて考えましたが、コンポーネントにカプセル化されたスタイルではありませんか？ – Ricevind

はい、スタイルはコンポーネントに含まれているとカプセル化されます。親子の両方に適用する必要のある共通のスタイルがある場合、カプセル化されないようにグローバルスタイルで保持することができます。あなたは子供に使用するクラスを渡すことができます、乾杯！ –

@Component({ 
    selector: '...', 
    template: ` 
<div>stuff before</div> 
<div class="wrapper> 
    <ng-content></ng-content> 
</div> 
<div>stuff after</div>`, 
    styles: [` 
.wrapper /deep/ * { 
// styles for children here 
} 
    `] 
})

出典

2017-05-19 17:09:13

親スタイルを子にバインドするAngular2

答えて

関連する問題