ViewEncapsulation.ShadowDom 根本不渲染 css

Question

我正在嘗試使用 ViewEncapsulation.ShadowDom 而我的 css 沒有得到渲染，我在這里做錯了什么，只有內聯 css 被應用，這可能是什么原因。請建議。我不能分享代碼，因為它是機密的.

編輯：我試過下面的例子

app.component.css

.test{
    background: green;
}

app.component.html

<p class="test"> HELLO</p>

app.component.ts

import { Component, ViewEncapsulation } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
  encapsulation:ViewEncapsulation.ShadowDom
})
export class AppComponent {
  title = 'app';
}

但在上面的示例中，它是從 ShadowDom 的 css 文件呈現的。

Answer 1

如果我沒記錯的話，這正是“ShadowDom”選項所做的。 它確實創建了一個 shadow dom 並封裝了 styles，因此只考慮了組件 styles 而沒有考慮全局/默認 styles。

Angular - 查看-封裝