如何以角度反應形式訪問表單控件和表單組

Question

我想pipe一個反應形式的表單組。

然后我想對這個組單獨的控件做一些檢查。

這是我定義表單的方式

  myForm = this.formBuilder.group({
    myFormNameDrop: this.formBuilder.group({
      myName:['',Validators.required],
      myDrop:['era']
    }),    
    style:[''],
    userId:[this.user_id]
  });

這是我嘗試創建的pipe

this.results = this.myForm.value.myFormNameDrop.valueChanges.pipe(      
  debounceTime(400),
  distinctUntilChanged(),            
  filter(formdata => formdata.myName.length > 0),
  switchMap( formdata => this.shoesService.details(formdata.myName)),
  shareReplay(1)
);//pipe  

我得到兩個錯誤。 TypeError: Cannot read property 'pipe' of undefined關於this.results = this.myForm.value.myFormNameDrop.valueChanges.pipe(

並且 VS 代碼顯示有關filter(formdata => formdata.myName.length > 0),屬性myName在類型'{}'上不存在

在這種情況下，如何訪問 formGroups 和 formGroups 控件？ 我使用角度 6

謝謝

Answer 1

您沒有正確獲取表單控件。 在FormGroup對象上使用get（）方法來獲取formControl

this.results = this.myForm.get('myFormNameDrop').valueChanges.pipe(      
  debounceTime(400),
  .........................
);

編輯：

要訪問myName您可以按照以下步驟進行操作：

this.myForm.get('myFormNameDrop').get('myName').value

---

另外，如果僅對myName感興趣，則可以直接監視myName valueChanges ，而不是監視myFormNameDrop

this.results = this.myForm.get('myFormNameDrop').get('myName').valueChanges.pipe(      
  debounceTime(400),
  distinctUntilChanged(),            
  filter((myName) => myName.length > 0),
  switchMap(myName => this.shoesService.details(myName)),
  shareReplay(1)
);

Answer 2

更改此行：

this.results = this.myForm.value.myFormNameDrop.valueChanges.pipe( ...

至 ：

this.results = this.myForm.controls.myFormNameDrop.valueChanges.pipe( ...

Answer 3

this.myForm.controls['myFormNameDrop']

在模板中工作