xhydongda的博客

对于非一次性的Observable的订阅，是需要释放的(模板html的async除外)，最佳实践是创建一个BaseComponent，为所有子类组件提供一个ngDestroyed$ Subject，在 ngOnDestroy() 勾子函数中执行next, complete，子类组件中只需takeUntil(ngDestroyed$)。 BaseComponentimport...

事件(event)与rxjs中的可观察对象(Observable+Observer)本质相同，在github上找到一个库typed-rx-emitter封装好了Emitter，读index.ts代码可以看出，Emitter通过Messages实现自定义事件的强类型(事件名由Messages的Key约束，参数的强类型由Messages[Key]来给定)，为Messages的Key分别维护了O...

功能目标： 改造primeng的colorpicker组件，增加RGB/HSB/HEX三种编辑模式、最近用过的颜色、常用颜色功能，并提供按钮仅在点击【应用】的情况下更新。 改造前后的功能对比如下图所示。#ff0080 为HEX编辑区，RGB/HSB用来切换下方R(H)、G(S)、B三个输入框的label。再下方12个格为最近使用过的颜色，接着是10×12常用颜色，最后是【取消】...

功能目标： 用于获取用户输入表格行、列数的组件，随鼠标移动，表格行列数变化，覆盖区域填充蓝色，效果如下图所示。 思路： 通过ngFor动态构造表格的行和列，通过maxrow,maxcol 控制表格白色区域，用rows,cols控制表格蓝色区域，使maxrow大于rows、maxcol大于cols。 由于ngFor没有i<n迭代功能，使用[0,1,2....

功能目标： 点击表格中一行，可向上、向下调整顺序。如下图，点【向下】按钮后第一行、第二行交换顺序。 组件：LayersWindow 利用primeng的table实现表格功能，html如下<p-dialog header="layers" [(visible)]="display"> <p-table #table [column...

功能目标： 点击列表项字符串弹出对话框，修改后关闭对话框，替换列表项原字符串。 点击“background"时弹出图2： 点击【apply】，列表框background变为background1 组件： TextareaDialog----提供图2的编辑对话框； LayersWindow----列表例子。...

PrimeNG 的 DropDown 组件官方例子提供了两种方式： 1.cars: SelectItem[]; 使用SelectItem，此时selectedCar1、selectedCar2、selectedCar3 都是 string 而不是SelectItem，在模板中要注意，不能设定optionLabel="label"，否则selectedCar1在运行时就变成了Sel...