Angular如何在多个动态创建的FormGroup上使用状态更改

Question

在ngOnInit()中，我有一个forEach方法，它用一些FormControls生成一些FormGroups。然后，我创建了一个数组，其中包含每个FormGroup的statusChanges。

ticketsFormArr: FormGroup[] = [];
this.tickets.forEach(ticket => {
this.ticketsFormArr.push(new FormGroup({
ticketType: new FormControl('', Validators.required),
rods: new FormControl('', Validators.required),
firstName: new FormControl('', Validators.required),
lastName: new FormControl('', Validators.required),
email: new FormControl('', Validators.required),
}))
})
this.ticketsFormArr.forEach(ticket => {
this.obsArr.push(ticket.statusChanges);
})

我想同时检查它们的状态是否为valid，因为我有一个按钮，只要至少有一个表单为invalid，它就会获得一个禁用的类。

首先，我尝试使用forEach，并使用ticket.statusChanges.subscribe()订阅每个票证，但我意识到它并不能同时做到这两件事，只有正在编辑的表单。

this.ticketsFormArr.forEach(ticket => {
console.log(ticket.status)
ticket.statusChanges.subscribe(val => {
console.log(val)
console.log("stat", ticket.status)

然后我尝试将statusChanges的Observables与combineLatest、merge、concat、forkJoin组合。我已经设法得到了他们的statusChanges，但似乎没有一个能像我希望的那样工作，要么我得到了与上面相同的结果，要么我只得到了EventEmitter的初始日志

我真的不知道我怎么能做到这一点。。。

Answer 1

没有必要使用这样一种重载方法。当按钮的[disabled]指令反复触发时，您可以非常直接地向前实现这一点。它会在几毫秒内注意到变化。这样做：

TS

/* returns true when at least one formGroup is invalid */
notAllFormGroupsAreValid(): boolean {
return this.ticketsFormArr.findIndex(group => !group.valid) > -1;
}

HTML

<button [disabled]="notAllFormGroupsAreValid()"></button>