通常我們需要使用管道實現(xiàn)對數(shù)據(jù)的格式化，Angular4中的管道和之前有了一些變化。本文主要介紹Angular4中常用管道，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧，希望能幫助到大家。

一、大小寫轉(zhuǎn)換管道uppercase將字符串轉(zhuǎn)換為大寫

lowercase將字符串轉(zhuǎn)換為小寫

將字符串轉(zhuǎn)換為大寫{{str | uppercase}}

str:string = 'hello'

頁面上會顯示

將字符串轉(zhuǎn)換為大寫HELLO

二、日期管道

date。日期管道符可以接受參數(shù)，用來規(guī)定輸出日期的格式。

現(xiàn)在的時間是{{today | date:'yyyy-MM-dd HH:mm:ss'}}

today:Date = new Date();

頁面上會顯示現(xiàn)在的時間是2017年05月08日10時57分53秒

三、小數(shù)管道

number管道用來將數(shù)字處理為我們需要的小數(shù)格式

接收的參數(shù)格式為{最少整數(shù)位數(shù)}.{最少小數(shù)位數(shù)}-{最多小數(shù)位數(shù)}

其中最少整數(shù)位數(shù)默認(rèn)為1

最少小數(shù)位數(shù)默認(rèn)為0

最多小數(shù)位數(shù)默認(rèn)為3

當(dāng)小數(shù)位數(shù)少于規(guī)定的{最少小數(shù)位數(shù)}時，會自動補0

當(dāng)小數(shù)位數(shù)多于規(guī)定的{最多小數(shù)位數(shù)}時，會四舍五入

圓周率是{{pi | number:'2.2-4'}}

pi:number = 3.14159;

頁面上會顯示

圓周率是03.1416

四、貨幣管道

currency管道用來將數(shù)字轉(zhuǎn)換為貨幣格式

{{a | currency:'USD':false}}

{{b | currency:'USD':true:'4.2-2'}}

a:number = 8.2515

b:number = 156.548

頁面上將顯示

USD8.25

0156.55這里的′USD′是美元UnitedStatesdollar的縮寫，當(dāng)為false時不顯示符，當(dāng)為true時，則顯示$符。后面的規(guī)定小數(shù)位數(shù)的參數(shù)和上面介紹的一樣。

相關(guān)推薦：

總結(jié)

以上是生活随笔為你收集整理的angular4 php,Angular4中常用管道实例详解的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。