在 Angular 中，如何从组件模板周围删除选择器标签？

Question

在 Angular 中，如何从组件模板中移除选择器标签？它正在制造问题 浏览器以显示组件内的<td> 字段。我有很多 <tr> 的实例，每个实例的第一个 <td> 样式不同：

<tr>
  <td>1.1</td><td>1.2</td>
        <app-summary-data-row [data]="data[1]">
        </app-summary-data-row>
    </tr>
    <tr>
            <td colspan=2>2</td>
            <app-summary-data-row [data]="data[2]">
            </app-summary-data-row>
        </tr>

但是，<td> 的大多数集合都遵循相同的模式，所以我想将其制作成相同的模板。问题是角度的标签，它扭曲了表格的结构。

Answer 1

您可以在@component装饰器中使用属性选择器：-

@Component({
  selector: '[component-name]'
  ...
})

然后将其用作：-

<div component-name>
  ...
</div>

根据文档：-

您可以指定一个 CSS 选择器来标识模板中的此指令。支持的选择器包括 element、[attribute]、.class 和 :not()。

不支持父子关系选择器。