时间戳

首页 > 解决方案 > valueChanges 尝试抛出对象为空的错误（反应形式）

angular - valueChanges 尝试抛出对象为空的错误（反应形式）

问题描述

角度 4 问题。

我试图以角度解读反应形式的某些部分，更具体地说，与反应形式相关，响应用户操作。

我想尝试对用户输入进行操作，即从建议列表中进行选择。

因此，在构造函数中，我有 formBuilder 和帮助我构建值的服务，我从中为输入字段选择一个值。

问题是，当我想使用 valueChanges 来捕获我输入的值并对其进行处理时，即使我采取了一些预防措施来防止对象为空，我也会收到“对象可能为空”错误。

如：额外的条件和在这之前，实际上在initForm里面定义了myForm（所以肯定不能为null）。

请任何快速指点，谢谢！

  constructor(private formBuilder: FormBuilder, private myService: MyService) {
  }

  ngOnInit() {
    this.initForm(this.formBuilder);
  }


 private initForm(formBuilder: FormBuilder): void {
    this.myForm = formBuilder.group({
      input1: ['', Validators.minLength(3)],
      input2: [{value: '', disabled: true}]
     });

    if (this.myForm) {
      if (this.myForm.get('input1')) {
        this.myForm.get('input1').valueChanges.subscribe(value => console.log(value));
        }
    }

  }

标签： angularangular-reactive-forms

解决方案

 if (this.myForm) {
      if (this.myForm.get('input1')) {
       const variable = this.myForm.get('input1'); // create a variable 
        variable!.valueChanges.subscribe(value => console.log(value)); // use Non-null assertion operator(used in Typescript 2)
        }
    }

因为编译器无法确定该变量为空，所以我们需要使用非空断言运算符。断言其操作数是非空且未定义的。

推荐阅读