[发明专利]一种Angular响应式表单控件联动的实现方法及系统在审
申请号: | 201911053238.X | 申请日: | 2019-10-31 |
公开(公告)号: | CN110764866A | 公开(公告)日: | 2020-02-07 |
发明(设计)人: | 周睿;刘牧;高传集 | 申请(专利权)人: | 浪潮云信息技术有限公司 |
主分类号: | G06F9/451 | 分类号: | G06F9/451 |
代理公司: | 37100 济南信达专利事务所有限公司 | 代理人: | 姜明 |
地址: | 250100 山东省济南市高*** | 国省代码: | 山东;37 |
权利要求书: | 查看更多 | 说明书: | 查看更多 |
摘要: | |||
搜索关键词: | 表单控件 响应式 绑定 联动 输入控件 版本代码 技术框架 兼容性 监听 触发 控件 工作量 更新 | ||
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事件。
该专利技术资料仅供研究查看技术是否侵权等信息,商用须获得专利权人授权。该专利全部权利属于浪潮云信息技术有限公司,未经浪潮云信息技术有限公司许可,擅自商用是侵权行为。如果您想购买此专利、获得商业授权和技术合作,请联系【客服】
本文链接:http://www.vipzhuanli.com/pat/books/201911053238.X/1.html,转载请声明来源钻瓜专利网。
- 上一篇:一种智能计算器的交互方法
- 下一篇:一种位置提醒方法及智能穿戴设备