6 Pipe

管道的作用是格式化组件模版数据.

6.1 Built in Pipe

1. date 日期格式化
2. currency 货币格式化
3. uppercase 转大写
4. lowercase 转小写
5. json 格式化json 数据

{{ date | date: "yyyy-MM-dd" }}

import { Component } from '@angular/core';


// 组件类 被@Component装饰器装饰
@Component({

  // 制定组件的使用方式, 当前问标记形式
  // app-root => <app-root></app-root> 

  selector: 'app-root', // 当前组件调用的时候你要以什么形式去调用
  templateUrl: './app.component.html', // 当前组件对应的模版是什么 组件模版文件路径
  styleUrls: ['./app.component.css'] // 当前组件对应的样式文件
})

// 导出一个类 
export class AppComponent {
  date = new Date();
}

// selector: '.app-root', // 当前组件调用的时候你要以什么形式去调用
// app-root => <div class="app-root"></div>
// selector: '[app-root]', // 当前组件调用的时候你要以什么形式去调用
// app-root => <div app-root></div>

<div> {{ date }} </div>

需要给管道传参

6.2 Custom Pipes