html - Angular Heroes 教程 css 选择器

Question

在 Angular 教程中 https://angular.io/tutorial/toh-pt1#selector ，我不明白这句话:“CSS 元素选择器，‘app-heroes’，匹配在父组件模板中标识此组件的 HTML 元素的名称。”我不知道 css 选择器是什么样的，因为我找不到任何与某些 HTML 元素名称相匹配的东西。没有名称为 app-heroes 或类似名称的 HTML 元素...这是如何工作的？

我只有一个文件夹结构/src/app/heroes，其中定义了我的英雄组件。它是否构造了一个由“parentfolder-folder”组成的名称？以及 css 元素选择器将引用什么？

Answer 1

I dont understand the sentence: "The CSS element selector, 'app-heroes', matches the name of the HTML element that identifies this component within a parent component's template."

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

正如您在@Component 中看到的那样，它定义了selector。值为 app-heroes这意味着您将使用 app-heroes像 html 元素(例如 <div> </div> 因此你将使用 <app-heroes></app-heroes> )来显示 HeroesComponent 的 View 。