angular 管道

<div style="text-align:center">
  <h1>
    Welcome to {{ title }}!
  </h1>
  <p>{{today | date:'yyyy-MM-dd HH:mm:ss' }}</p>
  <p>{{num | number:'1.2-4'}}</p> <!--/接收的參數格式為{最少整數位數}.{最少小數位數}-{最多小數位數} -->
  <p>{{num | number:'1.2-2'}}</p> 
  <p>{{num | number:'1.1-1'}}</p> 
  <p>{{{ "name": "semlinker" }| json }}</p> <!-- Output: { "name": "semlinker" } -->
  <p>{{userinfo| json }}</p> 
  
</div>

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

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent {
  title = 'angulardemo';
  public today=new Date();
  num=12.123456;
  userinfo:any={
    name:' 張三',
    age:24
  };
}

 

 效果圖：

---

 

http://bbs.loaderman.com/topic/5bf519657e9f5911d41f2a34