角度选择器标签

Question

在官方 ng 书（第 73 页）中，我读到可以通过两种不同的方式指示 Angular 6 组件标签。官方手册中的示例：

1. <inventory-app-root></inventory-app-root>

2. <div inventory-app-root></div>

但在我的 Angular 应用程序中，只有第一种方法有效。

<app-test-component></app-test-component>

（工作）

<div app-test-component></div>

（不起作用）

为什么是这样？

Answer 1

在你的组件代码中，会有一个如下所示的装饰器：

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})

selectorAngular 将使用该属性来查找您的组件。它的值可以是任何有效的 CSS 选择器，因此默认情况下，它需要一个名为 的标签my-app。

如果你想将其更改为属性，可以使用：

selector: '[my-app]',