Angular2/material 2:当以编程方式更改值时,md-input-container标签不会重置float

Question

我在使用@ angular/material md-input-containers和reactive form模块时遇到了问题.

我正在制作一个包含三个的登录表单,md-inputs这些表单都使用FormBuilder's' 绑定到值FormGroup.那里的一切都很好.

我的问题是,在ngSubmit函数上,如果输入的凭据无效,我将重置表单.使用该.reset()方法FormGroup会将值重置为默认值,但其中的浮动标签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()被调用时,表单将重置为默认值(空字符串),但标签仍将浮动:

标签仍然浮动.我重置公司ID以供参考.

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

Answer 1

尝试使用 md-input 控件而不是包装在 md-input-container 中的输入。这对我有用。