Angular 2始终将<style>标记放在root <head>处

时间：2016-07-07 13:22:24

标签： jquery html typescript angular head

除非组件具有封装：ViewEncapsulation.Native ，否则模板中的所有＆lt; style＆gt; 标记都放在＆lt; head＆gt; 主要DOM的部分。是否有任何技巧可以解决这个问题？

＆＃xA;＆＃xA;

我的用例是：

＆＃xA;＆＃xA;
    ＆＃xA;
  1. 我动态加载外部HTML模板并嵌入它，创建一个组件。
    2. ＆＃xA;
  2. 我不希望链接或嵌入的样式影响应用程序的其余部分。
    3. ＆＃xA;
  3. 我不能使用Native封装，我必须保留主DOM。那是因为我使用了一些操纵DOM的jQuery库，而且它们不能像Shadow DOM一样工作。这个jQuery库可以从这个自定义组件中加载的指令开始工作。
    4. ＆＃xA;
  4. 我试图用＆lt;替换＆lt; link href =“url”＆gt; 。样式＆gt; @import“url”＆lt; / style＆gt; ，但它们总是被移动到根＆lt; head＆gt; 并影响整个应用程序。
    5. ＆＃xA ;
＆＃xA;＆＃xA;

任何想法？如果没有办法解决这个问题，我应该尝试修复第3点。

＆＃xA;＆＃xA;

谢谢！

＆＃xA;

1 个答案:

答案 0 :(得分：1)

重写样式，以便选择器包含添加到每个元素的唯一_ngcontent-xxx属性，并且只匹配这些元素。

关于添加到<head>的样式，您无能为力。

如果这些样式影响其他元素，则可能是错误，或者您可能以仿真未涵盖的方式使用它。

相关问题
最新问题