1.创建组件(命令)
ng g component my-new-component 指定目录创建 :ng g component components/Footer
2.组件的引用(.html文件中引用)
<app-header></app-header>
3.数据绑定(属性绑定)
在ts文件中定义属性 下面介绍几种定义属性的方式
title ="这是一个属性";
msg ="";
赋值: this.msg ="只是另一个属性"
绑定属性(html文件中):
{{title}}
<div [title]="msg">鼠标放上去可以看到msg的值</div>
定义属性加修饰符 public
public username ="user";
定义属性的类型:(下面是string类型的属性)
pubic string calssname ="三年二班";
定义属性: (ts文件中定义 construstor他说是个构造函数哈 在这个里面给h赋值 在这个构造函数外面定义h这个属性)
this.h="<h2>这是一个h2用[innerHTML]来解析</h2>";
获取:
<div [innerHTML]="h"></div>(html文件中解析)
定义对象属性:
public obj ={ name="张三"; }
获取:
{{obj.name]}
3.数据循环
定义一个list
public list =[];
给list赋值:
this.list["11","22","33"];
循环list:
<ul> <li *ngFor="let item of list"> {{item}} </li> </ul>
循环时获取索引:
<ul>
<li *ngFor="let item of list;let i = index;">
{{item}} --{{i}}
</li>
</ul>
原文:https://www.cnblogs.com/zhaoqiusheng/p/11089611.html