如果在angular2中编辑后具有值，如何保持字段启用

Question

如果我在第一个字段下拉列表中选择第三个下拉值，则启用第二个字段。 所以，现在如果我通过选择下拉列表的第三个值来给出值，并给第二个字段一个值，它就会被采用。 现在我去编辑函数并更改一些其他值，因为第二个字段被禁用，我得到 ass null 或 undefined。 所以现在如果第一个字段在编辑模式下没有更改，我希望第二个字段有它的值

HTML：

TS：

private FormInit() {
    //Add
    if (!this.Details) {
      this.detailsForm = this.FB.group({
        Type: ['', Validators.required],
        ID: [{ value: 0, disabled: true }],
      });

    } else {
      // edit
      this.detailsForm = this.FB.group({
        Type: [this.Details.data.Type, Validators.required],
        SourceID: [{ value: this.Details.data.ID, disabled: true }],

      });
      if (this.Details.mode == 'readOnly') {
        this.detailsForm.disable();
      }
    }
  }

添加和编辑功能：

public save() {
    let addParams = this.detailsForm.value;
   addParams.Type = addParams.Type ? addParams.Type: 0;
    this.Service.add(addParams).subscribe(res => {
      console.log(res);
      this.successMessagePopUp(res);
    })
  }

  public update() {
    let updateParams = this.detailsForm.value;

    this.Service.update(updateParams).subscribe(res => {
      this.successMessagePopUp(res)
    })
  }

希望通过一种方式解决这个问题，如果选择了第三个下拉值，那么在编辑模式下我们可以保持第二个字段启用并在选择其他值时禁用吗？

Answer 1

通常disabled 值将在angular 中显示未定义。

PS：我想根据你的要求：

private FormInit() {
    if (!this.Details) {
      this.detailsForm = this.FB.group({
        Type: ['', Validators.required],
        ID: [{ value: 0, disabled: true }],
      });

    } else {
      // edit
      this.detailsForm = this.FB.group({
        Type: [this.Details.data.Type, Validators.required],
        ID: [{ value: this.Details.data.ID }],

      });

     if (this.Details.data.Type == 3)
     {
         this.detailsForm.get("ID").enable();
     }
     else
     {
         this.detailsForm.get("ID").disable();
     }

      if (this.Details.mode == 'readOnly') {
        this.detailsForm.disable();
      }
    }
  }