加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

验证 – Angular2 / material 2:当以编程方式更改值时,md-input

发布时间:2020-12-17 18:05:49 所属栏目:安全 来源:网络整理
导读:我在使用@ angular / material的md-input-containers和reactive forms模块时遇到了问题. 我正在使用FormBuilder的FormGroup创建一个包含三个md输入的登录表单,这些输入都与值绑定.那里的一切都很好. 我的问题是在ngSubmit函数上,如果输入的凭据无效,我将重置
我在使用@ angular / material的md-input-containers和reactive forms模块时遇到了问题.

我正在使用FormBuilder的FormGroup创建一个包含三个md输入的登录表单,这些输入都与值绑定.那里的一切都很好.

我的问题是在ngSubmit函数上,如果输入的凭据无效,我将重置表单.使用FormGroup的.reset()方法会将值重置为默认值,但md-input-containers中的浮动标签不会重置为原始位置,因为它们应位于空字段上.我猜材料设计指令正在寻找一个模糊事件来更新这个,但我不知道,我不知道如何强制这种情况发生.

这是ngSubmit函数:

submitForm(username: string,password: string,companyID: any):void {

    this.userService.login(username,password,companyId)
      .then(() => {
        this.router.navigate(['main']);
      })
      .catch(() => {
        this.loginForm.reset();
      })
    }

并且在调用this.loginForm.reset()时,表单将重置为默认值(空字符串),但标签仍将浮动:

Labels still float. I reset Company ID for reference.

有关如何解决此问题的任何想法?我真的不想调用ElementRef,虽然我已经尝试这样做以强制模糊并且没有解决它.

解决方法

尝试使用md-input控件而不是md-input-container中包含的输入. 它对我有用.

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读