Массивы Angular 7 и Form отключают кнопку группы форм, если связанная группа форм недопустима, выдает ошибку undefined

#angular #angular7 #angular-reactive-forms #formarray

#угловые #angular7 #angular-reactive-forms #formarray

Вопрос:

У меня есть массив форм, генерирующий элементы управления формами для каждой строки с помощью кнопки.

Мне нужно отключить соответствующую кнопку, если связанная группа форм в массиве форм недопустима.

Кнопка является:

 <button mat-raised-button color="warn" type="submit" color="warn" (click)="addDist(element, i)">
                <mat-icon>add</mat-icon> Add
</button>

С формой массива:

 this.arrayGroup = new FormGroup({
  distribution: new FormArray(this.dataSource.data.map(x => new FormGroup({
    actual_date: new FormControl('', Validators.required),
    note: new FormControl(''),
    kit: new FormControl('', Validators.required)
  })
  ))
});

Поэтому в каждой строке мне нужно отключить ее, пока не будут заполнены date и kit . Другая кнопка должна оставаться недействительной, если их формы не заполнены.

Я пытался:

 <button mat-raised-button color="warn" [disabled]="!arrayGroup.get('distribution')).at(i).valid" type="submit" color="warn" (click)="addDist(element, i)">
                <mat-icon>add</mat-icon> Add
</button>

Но получил ошибку:

Неперехваченный (в обещании): Ошибка: ошибки синтаксического анализа шаблона: Ошибка синтаксического анализа: неожиданный токен ‘)’ в столбце 32 в [!arrayGroup.get(‘distribution’)).at(i).допустимый]

Затем я попытался:

 [disabled]="!arrayGroup.distribution.at(i).valid"

И я получил:

ОШИБКА TypeError: не удается прочитать свойство ‘at’ неопределенного объекта at.eval [как обновленные указания]

1. Первая ошибка — это синтаксическая ошибка. Допустимый синтаксис будет: [disabled]="!arrayGroup.get('distribution').at(i).valid"

2. @JSONDerulo это сработало. Вы можете опубликовать это в качестве ответа, пожалуйста.

Ответ №1:

Это синтаксическая ошибка. В вашем коде слишком много одной скобки.

Вот обновленный код:

 [disabled]="!arrayGroup.get('distribution').at(i).valid"