Angular组件
您看到的页面是应用程序外壳。shell由名为的Angular 组件控制AppComponent。
组件是Angular应用程序的基本构建块。他们在屏幕上显示数据，监听用户输入，并根据该输入采取行动
更改程序标题
在您最喜爱的编辑器或IDE中打开项目并导航到该src/app文件夹。
你会发现AppComponent分布在三个文件上的shell的实现：
app.component.ts - 用TypeScript编写的组件类代码。 app.component.html - 用HTML编写的组件模板。 app.component.css - 组件的私有CSS样式。
打开组件类文件（app.component.ts）并将title属性值更改为“Tour of Heroes”。
//app.conmponent.html
<!--
1.这里和普通的HTML文件差不多，只不过多了模板变量
2.{{value}}，双花括号是Angular的插值绑定语法。此插值绑定title在HTML标头标签内呈现组件的属性值。
-->
<div class="inCenter">
<h1>
Welcome to {{ head }}!
</h1>
</div>
//app.component.css
//普通的CSS样式表 .inCenter { text-align: center; color: #f00; }
//app.component.ts
//逻辑以及变量 import { Component } from ‘@angular/core‘; @Component({ // selector:选择器 selector: ‘app-root‘, // 模板地址 templateUrl: ‘./app.component.html‘, // 样式地址(数组) styleUrls: [‘./app.component.css‘] }) export class AppComponent { title = ‘fcuk‘; head = ‘6666‘; }
