通过服务承诺加载formgroup值时,md-input占位符不会淡出

时间:2017-02-15 12:39:13

标签: angular angular-material2

在angular2中,我正在尝试将数据加载到输入的新方法。我正在使用formgroup,以便我可以保持我的HTML清洁,并在组件ts文件中有更多的验证逻辑。我渲染表单元素的代码如下: -

constructor(private _fb: FormBuilder, private userService: UsersService,
        private router: Router, private accountRoutes: AccountRoutes) {
        this.myForm =

            this.myForm = this._fb.group({
                user: this._fb.group({
                    "EmailAddress": [null, Validators.compose([
                        Validators.required
                    ])]
                })
            });

    }
ngOnInit() {

        this.userService.GetUser().subscribe(
            (response) => {
                this.user = {
                    EmailAddress: "aaa@aaa.com",//response.EmailAddress,
                    FirstName: response.FirstName,
                    MiddleName: response.MiddleName,
                    Surname: response.Surname,
                    Password: "",
                    ConfirmPassword: ""
                };
                this.myForm.controls["user"].setValue(this.user, { onlySelf: true });
            });

});         }

Html代码如下:

<md-card-content fxLayout="column" formGroupName="user">
   <md-input-container>
     <input md-input placeholder="Email" formControlName="EmailAddress"
                               type="email" name="EmailAddress" />
   </md-input-container>
</md-card-content>

有关问题的详细信息,请查看以下图片。正如您在图像中看到的那样,当我从后端加载数据时,占位符仍然留在后台 enter image description here 但每当我从后端API加载表单元素的数据时,占位符就不会向上移动。

1 个答案:

答案 0 :(得分:0)

可以在此处找到此问题的解决方案。这个问题已在master分支中修复,该分支即将发布。

[https://github.com/angular/material2/issues/3117#event-964077880][1]