看完上面关于 Select 的两个例子,或许已经不需要我再多说什么了,最终我设计的 Checkbox Group 代码如下:
<mtx-checkbox-group [items]="cars" bindLabel="name" [(ngModel)]="selectedCars" [compareWith]="compareWith"> </mtx-checkbox-group>上面的代码没有任何多余的过滤筛选就完成了开篇提出的需求,对数据的操作全都隐藏在双向绑定的内部。
总结这篇文章拖沓了非常久,一方面是自己工作很忙,另一方面做开源项目占据了大部分时间。
从最开始考虑 Checkbox Group 的重构方案到最终实现差不多用了半年多的时间,不过实际开发时间大概也就一周吧。相比之前借鉴 Ant Design 的方案来说,现在的方案更加灵活,有效减少了数据操作的代码,不过仍然有很大的优化和提升空间。
如果大家发现本文有不当之处,欢迎交流指正!