作者:Grey
原文地址: http://www.cnblogs.com/greyzeng/p/5538630.html
Pipe類似過濾器,比如,在一個字符串要展現在頁面之前,
我們需要對這個字符串進行一些操作,比如:將字符串轉化為大寫,加一個前綴/后綴……
Pipe的作用就是來實現類似的需求:
模型如下:
假設一個字符串: "hello", 我們在展示這個字符串的時候,需要先轉換為大寫,
然后加一個后綴 " WORLD", 最后字符串展示的效果是HELLO WORLD
因為需求比較簡單,我們可以用一個Pipe來實現轉大寫和增加后綴的功能,
- 進入項目:cd MyFirstApp
-
新建一個名字為NewPipe的Pipe,
命令:ionic g pipe NewPipe
項目目錄會多出一個文件夾:
-
打開NewPipe.ts, 修改其中的transform方法
-
在../app/home/home.ts中引入這個Pipe
-
在../app/home/home.html中增加字符串顯示:
在../app/home/home.ts中,設置字符串的值:
-
注入Pipe
在../app/home/home.html中,
注意,這里的newPipe是這個名字:
- 運行,ionic serve -l
參考:
http://www.joshmorony.com/how-to-use-pipes-to-manipulate-data-in-ionic-2/
http://mcgivery.com/understanding-ionic-2-pipe/
------
上一篇:Ionic2學習筆記(2):自定義Component
下一篇:Ionic2學習筆記(4):*號