ionic3.X 自定义pipe

1.在src目录新建pipes文件夹,使用Cli 命令ionic generate pipe mattDamon生成pipe文件

注意:
这里有个坑,自动生成的pipe文件中的@Pipe修饰的name值可能会有"-",ionic对此敏感,要去掉"-",比如我将matt-damon改成了mattDamon

Paste_Image.png
2.在pipes文件夹里新建pipes.module.ts文件,将项目中所有的pipe导入(例如下面的MattDamonPipe),代码如下:
import { NgModule } from '@angular/core';
import {MattDamonPipe} from './matt-damon';

@NgModule({
    declarations: [
        MattDamonPipe,
    ],
    imports: [

    ],
    exports: [
        MattDamonPipe,
    ]
})
export class PipesModule { }

这里也可以不要pipes.module.ts文件,直接在app.module.ts里导入

3.使用:在需要使用页面的module.ts文件里导入PipesModule,

比如:

Paste_Image.png

然后在页面的html里(注意此pipe的名字必须和你写的pipe文件里的name值一样):

Paste_Image.png
Paste_Image.png
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容