代码之家 › 专栏 › 技术社区 › annepic

valueChanges尝试引发对象为null的错误(被动形式)

angular-reactive-forms angular

0

annepic · 技术社区 · 8 年前

角度4问题。

我试图从角度解读反应性表单的某些部分,更具体地说,是与响应用户动作的反应性表单相关的。

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

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

问题是,当我想处理valueChanges时,为了捕获我输入的值并对其进行处理,我得到了一个“object is always null”错误,尽管我采取了一些预防措施来防止对象为null。

例如:额外的条件,在此之前,在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));
        }
    }

  }

2 回复 | 直到 8 年前

1

2

Denys Fiialko 8 年前

 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)
        }
    }

因为编译器无法判断该变量是否为null,所以我们需要使用非null断言运算符。断言其操作数是非null和非未定义的。

2

1

John Velasquez 8 年前

也许你应该这样做

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