gx-watcher
基于agular6实现数据变化监听的service
安装pm istall gx-watcher --save配置对于agular6项目不需要配置,Ok!
对于agular4,agular5配置app.module.ts文件
@NgModule({ ... providers: [NgxWatcherService], ...})export class AppModule { }使用 import {KvWatcher, IterWatcher, NgxWatcherService} from 'gx-watcher'; @Compoet({...}) export class TestCompoet implemets DoCheck { private kvWatcher: KvWatcher<ay>; private iterWatcher: IterWatcher<ay>; value = {}; // keyValue类型 array = []; // 可迭代类型 costructor(private service: NgxWatcherService) { this.kvWatcher = service.of(this.value); this.iterWatcher = service.ofIter(this.array); } gDoCheck(): void { this.kvWatcher.watch( this.value, v => cosole.log(`chage after value:`, v), (t, v) => cosole.log(`chaged value: WatchChageType=${t} ${v.key} ${v.previousValue} ${v.curretValue}`) ); this.iterWatcher.watch( this.array, v => cosole.log(`chage after value:`, v), (t, v) => cosole.log(`chaged value: WatchChageType=${t} ${v.curretIdex} ${v.item} ${v.previousIdex} ${v.trackById}`) ); } }关于本组件项目本项目使用AgularCLI versio6.0.7生成
运行项目使用 gserve启动开发服务.然后打开浏览器输入地址https://localhost:4200/ 即可
编译组件pm ru build:lib生成编译后的文件在dist/gx-watcher目录
运行效果LICENSEApache-2.0
评论