у меня есть этот *ngFor для некоторых полей ввода,
<ng-container *ngFor = "let qp of myQuoted.quoteQuantityPrice; let index = i;">
<td>
<input #ng_price[i] = "ngModel" class = "number" type = "number" pattern = "[1-9]*" [(ngModel)] = "qp.price" required>
</td>
</ng-container>
и я хочу, чтобы эта кнопка была отключена, если какое-либо из полей #ng_price не соответствует шаблону регулярного выражения, в нем нет данных
для объектов, у которых есть только одно поле ввода, у меня отключена кнопка следующим образом:
<button [disabled]= "ng_supplier.invalid || ng_inventory.invalid || ng_leadWeeks.invalid || ng_multOrderQty.invalid || ng_minOrderQty.invalid" (click) = "Save()">Save</button>
Я хочу добавить ng_price.invalid
в этот список валидаторов
Я попытался добавить ng_price.invalid
в отключенный блок, но, как я и ожидал, на самом деле это не работает, и сборка проекта завершается неудачей, потому что ng_price.invalid
не существует.
Попробуй это
HTML
<ng-container *ngFor = "let qp of myQuoted.quoteQuantityPrice; let index = i;">
<td>
<form [formGroup] = "formArr[i]">
<input formControlName = "app_price" class = "number" type = "number">
</form>
</td>
</ng-container>
...
<button [disabled]= "(formArr[i].get('app_price').touched && formArr[i].get('app_price').invalid) || ng_supplier.invalid || ng_inventory.invalid || ng_leadWeeks.invalid || ng_multOrderQty.invalid || ng_minOrderQty.invalid" (click) = "Save()">Save</button>
тс
formArr: any[] = [];
pricePattern: any = "[1-9]*" ;
...
constructor(
private fb: FormBuilder,
) {
for (let j of this.myQuoted.quoteQuantityPrice) {
this.formArr.push(
this.fb.group({
app_price: ["", [Validators.required, Validators.pattern(this.pricePattern)]],
})
);
}
}
...