时间戳

首页 > 解决方案 > Angular 6读取空输入值

angular - Angular 6读取空输入值

问题描述

我通过 HttpClient 从 PHP 服务器获取 Angular 6 的值，并将该值发送到 aformControlInput以设置为默认值：

<mat-form-field color="warn">
    <input matInput formControlName="unit_type" 
    placeholder="Unit type" value="{{unit_type}}">
</mat-form-field>

我将相同的值保存到一个变量中，将其与输入的值进行比较，以便我可以检测到更改，以了解我是否激活了更新按钮：

this.unit_type = data['unit_info'][0]['unit_type'];

安慰这个变量正确显示，并且值显示在输入中。

现在，当我再次获得它的价值时，如下所示：

unit_type_upd = this.formGroup.controls['unit_type'].value;
console.log(unit_type_upd);

它向我显示空值，但是当我更改它时，它会检测到更改，并进行比较过程。

为什么unit_type_upd没有在组件加载的输入中显示值？

标签： angularangular6angular-reactive-forms

解决方案

使用Angular Reactive Form时，不应将数据绑定到诸如

value="{{unit_type}}"

正确的方法是在你的组件中

this.formGroup.controls['unit_type'].setValue(this.unit_type)

您可以在创建FormControl这样的时候设置默认值

new FormControl('default value', [Validators.required]);

推荐阅读