今天完成的事情：

跟师弟讲解管道的应用，UI组件插件的应用 ，编辑功能 
明天计划的事情：

完成编辑功能和删除功能
遇到的问题：

编辑功能接口什么都写好了，问题在于 我该如何让页面HTML表单知道我点击的是那个ID来改变它的上线还是草稿的状态

 
收获：

通过学习了解到管道

自定义管道

首先自定义管道你要先创建一个文件夹，用来专门放置你设置自定义模块的。

先创建一个自定义管道模块也就是moudle,然后在创建管道pipe,ng g 会出现。

如图

这里要注意下 所以组件都是由模块来之间互相联系的。

首先创建一个常量文件

app.constant.ts

在这文件创建你所要定义管道的对象

如：

export const status = {

    line:{

        1:'上线',

        2:'草稿',

    }

}

这里的对象主要是 后台数据传进来的数据时 布尔值只有数值1和2所以用这个对象来表示1是上线 2是草稿。

常量准备好后就在管道文件进行声明和写方法

App.pipe.ts

@Pipe({

  name:'status'

})

export class Status implements PipeTransform{

  transform(value: any, ...args: any[]): any {

    return status.line[value];

//这表示返回status里面对象line里面的key值，因为line是对象里面的值是数字，

    // 如果里面的值不是对象,是字符串的话可以直接写错status.line.string字符串这样就直引用

  }

}

固定语法 @Pipe里面是管道名称到时候要在HTML上进行应用

export class Status implements PipeTransform

这里面就是写方法 class Status算是方法名称这里随便取名字

如

 transform(value: any, ...args: any[]): any {

    return status.line[value];

  }

方法里面返回的值是你在常量里面的

上面的方法也是固定写法而里面的数值可以改变写法

同时你要进行引入常量模块里面的对象

import { status } from './app.constant'

由于我是的对象名称是status 所以这里的引入也是status

引入完成后还要在模块当中进行声明和模块输出

import { AppPipe,Status } from './app.pipe';

@NgModule({

  declarations: [

    AppPipe,

    Status

  ],

  //模块输出

  exports:[

    Status,

  ]

})

先在declarations声明我的模块功能，

如

export class Status implements PipeTransform

先进行装饰器，装饰成管道功能的类 class就可以看做是这个功能的名字，然后在模块里面声明这个功能，然后在输出这样其他的组件就可以应用这个模块里面的功能。

注意：exports是输出模块功能，这相当于是输出我这个Status里面的功能让其他模块引用我这个模块可以用我这个功能。

然后在你要用的模块里面接收

如我列表组件模块moudle

import{ PipesModule } from '../../../pipes/pipes/pipes.module'

进行接收

imports: [

    CommonModule,

    ListRoutingModule,

    NzInputModule,

    NzTableModule,

    NgZorroAntdModule,

    FormsModule,

    PipesModule,

  ]

})

最下面就是我模块之间的接收

总结：  一定要记住你的申明管道这个TS文件一定要在模块里面声明下不然是用不了的，并且如果你要在别的模块里面应用自定义好的模块需要在管道自定义模块里面进行输出，让别的模块能接收到你的模块文件类容。

还有当你直接用管道过滤的时候可以不用在组件声明你写好的过滤管道的名字，如果是要用下拉框需要你在要用的那个TS文件里面写管道名称。

管道除了可以声明对象外还可以直接写字符串，如果是直接写字符串可以不用在后面加value 可以直接在后面加srting类型