我正在使用angular创建一个动态表单字段。每当发生变化时,我都想为输入设置值

时间:2018-09-21 12:44:15

标签: angular dynamic

  constructor(private orderService: OrderService, private fb: FormBuilder, public dialog: MatDialog, public snackBar: MatSnackBar, private productService: ProductService) { 
    this.orderForm = this.fb.group ({ //form validator for create and update
      '_id': [ "" ],
      'orderClientName': [ "", Validators.compose([Validators.required, Validators.pattern(/^[a-zA-Z\s]*$/), Validators.minLength(1), Validators.maxLength(50)]) ],
      'orderContact': [ "", Validators.compose([Validators.required, Validators.pattern(/^[0-9]*$/), Validators.minLength(11), Validators.maxLength(11)]) ],
      'orderItem': this.fb.array([ this.createItem() ]),
      'orderDiscount': [ "", Validators.compose([Validators.pattern(/^[0-9]*$/), Validators.minLength(1), Validators.maxLength(20)]) ],
      'orderTotal': [ "", Validators.compose([Validators.required, Validators.pattern(/^[0-9]*$/), Validators.minLength(1), Validators.maxLength(5)]) ]
    });
  }


  createItem(): FormGroup {
    return this.fb.group({
      'productId': [ "", Validators.compose([Validators.required, Validators.pattern(/^[a-f\d]{24}$/i), Validators.minLength(24), Validators.maxLength(24)]) ],
      'productPrice': [ "", Validators.compose([Validators.required, Validators.pattern(/^[0-9]\d*$/), Validators.min(1), Validators.max(99999)]) ],
      'productQuantity' : [ "", Validators.compose([Validators.required, Validators.pattern(/^[0-9]\d*$/), Validators.min(1), Validators.max(99999)]) ],
    });
  }

这是我的表单组,每当productId发生更改时,我都想将值设置为productPrice。但我不知道如何设定价值。

  getPrice(index){
    let a = this.orderForm.value.orderItem[index]['productPrice'].patchValue({productPrice: "12"});
    console.log(a);
  }

,以上代码不起作用。如何解决?

1 个答案:

答案 0 :(得分:3)

您需要先提取orderItem,然后将值分配给productPrice

let arr = this.orderForm.controls['orderItem'].value 
arr[0].patchValue({
  {productPrice: "12"}
});