validation - Angular2/ Material 2 : md-input-container label is not resetting float when value is changed programmatically

Question

我在使用@angular/material 的 md-input-containers 和响应式表单模块时遇到问题。

我正在制作一个包含三个 md-inputs 的登录表单，它们都使用 FormBuilder 的 FormGroup 绑定(bind)到值。那里一切正常。

我的问题是，在 ngSubmit 函数中，如果输入的凭据无效，我将重置表单。使用 FormGroup 的 .reset() 方法会将值重置为默认值，但是 md-input-containers 中的 float 标签是没有重置到他们原来的地方，因为他们应该在一个空旷的地方。我猜 Material Design 指令正在寻找一个模糊事件来更新它，但我不知道，而且我不知道如何强制它发生。

这是 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() 时，表单将重置为默认值(空字符串)，但标签仍将 float :

Labels still float. I reset Company ID for reference.

知道如何解决这个问题吗？我真的不想调用 ElementRef，尽管我已经尝试这样做来强制模糊，但并没有解决问题。

Answer 1

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