时间戳

首页 > 解决方案 > 从来自后端响应的对象设置表单状态

angular - 从来自后端响应的对象设置表单状态

问题描述

我有一个带有 4 个不同表单控件的表单：

this.form = this.formBuiler.group({
    controlOne: ['', Validators.required],
    controlTwo: ['', Validators.required],
    controlThree: ['', Validators.required],
    controlFour: ['', Validators.required]
});

我也有来自与表单对象一对一映射的服务的响应。响应中的键是布尔值，指示相应的表单控件是否应标记为无效：

{
    controlOneBoolean: true,
    controlTwoBoolean: false,
    controlThreeBoolean: false,
    controlFourBoolean: true
}

我想使用来自后端的这种状态来相应地设置表单状态，并且想知道是否有一种干净的方式来这样做。我正在考虑可能遍历两个对象并将form.get(key).invalid属性设置为相应的值。

有什么建议么？

标签： angularangular-forms

解决方案

我们可以使用formControls setError方法来设置来自后端服务的状态。

您可以使用

this.form.get('controlname').setErrors(controlBooolean ? 'valid': true : 'valid': false )

当然，您将不得不迭代您得到的响应，这里controlBooolean是来自后端响应的单个项目

推荐阅读