javascript - _ngcontent-c# 在 Angular 中是什么意思？

Question

我正在学习 Angular 2/4，我看到带有 ng 生成属性的 html 标签:_ngcontent-c0, _ngcontent-c1...

这个c值是什么意思？

Answer 1

_ngcontent-c# 属性在您使用 ViewEncapsulation.Emulated 时添加 - 这是默认设置。 Angular 使用这些属性来定位具有样式的特定元素。数字 c 是宿主组件的唯一标识符。例如，如果您有两个具有以下模板的组件:

ComponentA
<span></span>
<comp-b></comp-b>

ComponenB
<h1></h1>

Angular 会将所有在组件 A 内具有样式的元素标记为 _ngcontent-c0 并将所有在组件 B 内具有样式的元素标记为 _ngcontent-c1:

<comp-a>
    <span _ngcontent-c0></span>
    <comp-b _ngcontent-c0>
        <h1 _ngcontent-c1></h1>
    </comp-b>
</comp-a>