[发明专利]一种Angular响应式表单控件联动的实现方法及系统

权利要求书

1.一种Angular响应式表单控件联动的实现方法，其特征在于：该方法将多个输入控件绑定到同一个FormControl下，用户在界面通过绑定的输入控件输入时，触发FormControl的valueChanges，valueChanges监听输入值的变化情况，同时更新FormControl下绑定的全部控件的显示的值，实现控件联动。

2.根据权利要求1所述的Angular响应式表单控件联动的实现方法，其特征在于：该方法具体包括以下步骤：

S1、将多个输入控件绑定到同一个FormControl下，输入值显示在控件上；

S2、用户在界面通过绑定的多个输入控件输入；

S3、触发FormControl的valueChanges；

S4、valueChanges监听输入值是否有变化，若无变化则触发valueChanges继续监听输入值，若有变化，则更新FormControl下绑定的全部控件的显示的值，并且不触发valueChanges。

3.根据权利要求2所述的Angular响应式表单控件联动的实现方法，其特征在于：步骤S1中，输入控件的数量根据需要设定。

4.根据权利要求或3所述的Angular响应式表单控件联动的实现方法，其特征在于：在Angular表单组件的模板上，通过FormControlName将多个输入控件绑定到同一个FormControl下。

5.根据权利要求4所述的Angular响应式表单控件联动的实现方法，其特征在于：步骤S4中，监听到输入值变化时，更新全部输入控件的值，并阻止由于输入控件值的变化再次触发valueChanges事件。

6.一种Angular响应式表单控件联动的实现系统，其特征在于：该系统包括绑定模块、输入模块、触发模块和监听模块：

绑定模块用于将多个输入控件绑定到同一个FormControl下，输入值显示在控件上；

输入模块用于用户在界面通过绑定的多个输入控件输入；

触发模块用于触发FormControl的valueChanges；

监听模块用于valueChanges监听输入值是否有变化，若无变化则触发valueChanges继续监听输入值，若有变化，则更新FormControl下绑定的全部控件的显示的值，并且不触发valueChanges。

7.根据权利要求6所述的Angular响应式表单控件联动的实现系统，其特征在于：绑定模块中，在Angular表单组件的模板上，通过FormControlName将多个输入控件绑定到同一个FormControl下，其中输入控件的数量根据需要设定。

8.根据权利要求7所述的Angular响应式表单控件联动的实现系统，其特征在于：监听模块在监听到输入值变化时，更新全部输入控件的值，并阻止由于输入控件值的变化再次触发valueChanges事件。