angular 知识点总结

一、生命周期

指令与组件共有的钩子

ngOnChanges

ngOnInit

ngDoCheck

ngOnDestroy

组件特有的钩子

ngAfterContentInit

ngAfterContentChecked

ngAfterViewInit

ngAfterViewChecked

二、管道（处理数据）

常用值：

1、大小写转换管道

uppercase将字符串转换为大写

lowercase将字符串转换为小写

例如：<p>{{str | uppercase}}-{{str1 | lowercase}} </p>

2、日期管道

date：日期管道可以接受参数，用来规定输出日期的格式。

例如：{{today | date:'yyyy-MM-dd HH:mm:ss'}}

3、小数管道

number管道用来将数字处理为我们需要的小数格式

接收的参数格式为{最少整数位数}.{最少小数位数}-{最多小数位数}

其中最少整数位数默认为1

最少小数位数默认为0

最多小数位数默认为3

当小数位数少于规定的{最少小数位数}时，会自动补0

当小数位数多于规定的{最多小数位数}时，会四舍五入

例如：

<p>num保留4位小数的值是：{{num | number:'3.2-4'}}</p>

num = 166.166666;

页面上显示：num保留4位小数的值是：166.1667

4、货币管道

currency管道用来将数字转换为货币格式

  <p>总价：{{(price * count) | currency:'￥'}}</p>

  count = 9;  price = 1.5;

页面上显示：总价：$13.50

5、字符串截取

slice：start[：end]//开始下标到结束下标 不包括结束下标

例如：<p>{{name|slice:2:4}}</p>

name='你好好呀';

页面上显示：好呀

6、json(数据)格式化

例如：<div> <p>{{ { name: 'smile' } | json }}</p></div>页面上显示：{ "name": "smile" }

7、自定义管道

ng g pipe filter/pipeTable