1. 程式人生 > >Angular中響應式表單 FormBuilder、FormControl 、FormGroup、FormArray、setControl、setValue用法總結(不定時更新)

Angular中響應式表單 FormBuilder、FormControl 、FormGroup、FormArray、setControl、setValue用法總結(不定時更新)

以我的專案作為示例,總結一下Angular響應式表單的應用和常用的方法:

1.建立表單

form.ts程式碼

import { Component, OnInit } from "@angular/core";
import { FormArray, FormBuilder, FormControl, FormGroup, Validators } from "@angular/forms";

@Component({
  selector: "app-form",
  templateUrl: "./form.component.html"
})
export class SLSDetailComponent implements OnInit{

  slsForm: FormGroup;//定義表單slsForm

  ngOnInit(): void {
    
      this.createForm();//初始化建立表單
   
  }

  createForm() {//建立專案需要的資料(多層巢狀的資料)
    
    this.slsForm = this.fb.group({
      UserServiceDescription: this.fb.group({}),
      VPL: this.fb.group({})
    });

  }



}