基本语法

双花括号语法是 Angular 的插值绑定语法。 这个插值绑定的意思是把组件的 title 属性的值绑定到 HTML 中的 h1 标记中。

{{title}}


export class AppComponent {
title = 'Tour of Heroes';
}

创建新的列表组建一般使用cmd的方式来创造
命令执行完整后会在对应的IDE编辑器下面加载出对应的文件

ng generate component heroes
@Component 是个装饰器函数,用于为该组件指定 Angular 所需的元数据。

CLI 自动生成了三个元数据属性:

selector— 组件的选择器(CSS 元素选择器)

templateUrl— 组件模板文件的位置。

styleUrls— 组件私有 CSS 样式表文件的位置。

CSS 元素选择器 用来在父组件的模板中匹配 HTML 元素的名称,以识别出该组件。
ngOnInit 是一个生命周期钩子,Angular 在创建完组件后很快就会调用 ngOnInit。这里是放置初始化逻辑的好地方。
始终要 export 这个组件类,以便在其它地方(比如 AppModule)导入它。

创建完成一个组建需要在页面上显示的话就需要在app.component.html上面添加组建显示

{{title}}


创建一个类

hero.ts
将该类导入 import {Hero} from '../hero';
引入参数

  hero: Hero = {
    id: 1,
    name: 'Windstorm'
  };

※特别注于语法上的空格

你可能感兴趣的:(基本语法)