? ? ? ? 因為之前一直是用的vue,最近開始研究學習angular,跟大家分享一下我的學習研究的小心得,不對之處,敬請指正,謝謝大家。
? ? ? ? 首先創(chuàng)建一個ts文件來實現(xiàn)我們的自定義管道方法:目前我的過濾需求是在ngFor時實現(xiàn)數(shù)據(jù)去重,這個管道類實現(xiàn)了?PipeTransform接口的?transform?方法,該方法接受一個value數(shù)組過濾去重返回一個數(shù)組。首先通過?@Pipe裝飾器來告訴 Angular這是一個管道,這個?@Pipe?裝飾器允許你定義管道的名字,例如我的管道名字就叫cutemore,需要注意的是,我們必須把這個管道添加到?AppModule?的?declarations?數(shù)組中,手動注冊自定義管道,不然使用的時候是找不到你的管道方法的。


? ? ? ?自定義管道方法注冊好了后接下來就是研究一下該如何使用了,首先我設置一個setList方法去處理我接口接收回來(省略,我這里隨便模擬一個)的list數(shù)據(jù),然后在ngOnInit生命周期中執(zhí)行。然后在要過濾的地方使用:數(shù)據(jù)|過濾方法名稱,這里跟vue的的使用方法是一致的。



最后展示一下實現(xiàn)效果,每一個下拉框中的重復數(shù)據(jù)都被已經(jīng)被過濾掉了。



