1
コンポーネントにencapsulation: ViewEncapsulation.Nativeがない限り、テンプレート内のすべての<style>タグはメインDOMの<head>セクション内に配置されます。これを打つためのトリックはありますか？角2は常にルートに<style>タグを配置します<head>
私のユースケースは、次のとおりです。
- 私は動的に外部のHTMLテンプレートをロードし、コンポーネントを作成し、それを埋め込みます。
- リンクされているか埋め込まれているスタイルは、他のアプリにも影響を与えたくありません。
- ネイティブカプセル化を使用できません。メインDOMを維持する必要があります。これは、DOMを操作するいくつかのjQueryライブラリを使用しているため、Shadow DOMで期待どおりに動作しないためです。このjQueryライブラリは、このカスタムコンポーネントにロードされたディレクティブから動作します。
- 私は
<style>@import "url"</style>で<link href="url">を交換しようとしましたが、いつも自分のルート<head>に移動し、アプリケーション全体に影響を与えています。
任意のアイデア？これを解決する方法がない場合は、ポイント3を修正するようにしてください。
ありがとう！セレクタは、各要素に追加されており、これらの要素のみを一致させるために独自の_ngcontent-xxx属性を含むように
私は 'ViewEncapsulation.None'、スタイルはまだ' '
に移動されている使用している場合。また、他の要素（カプセル化オプションなし）に影響するのは、独自の属性が追加されないためです。これは、外部CSSであるためです。 – AlvYuste私は参照してください。なぜあなたは 'None'を使うのですか？ほとんどの場合、これは必要ではありません。 'Emulated 'のような自分自身の属性を'：host（my-component）{...}'のように追加することで、競合しないようにスタイルを書くことができます。 'タグを使用します。 –
はい、ここの問題はスタイルが外部であり、完全にコントロールできないことです。 – AlvYuste