How to use Angular validation properties inside for?

Question

I am trying to find out if the input element in the iteration of a for(*ngFor) loop iteration is dirty but I cannot find a way to dynamically name the validation variable, therefore cannot get the outcome I am looking for.

<tr *ngFor="let user of users">
  <td>
    <div class="row">
      <div class="col-sm-10">
         <input id="{{user.id}}" class="form-control" [(ngModel)]="user.name" #[user.id]="ngModel" />
      </div>
      <div class="col-sm-2">
         <button *ngIf="[user.id].dirty" class="btn btn-success">Save</button>
      </div>
    </div>
  </td>
</tr>

please give brief description what you exactly want?

bipin patel
– bipin patel

2017-04-03 14:16:16 +00:00
Commented Apr 3, 2017 at 14:16 — bipin patel
– bipin patel, Commented Apr 3, 2017 at 14:16

Ján Halaša · Accepted Answer · 2017-04-03 14:19:43Z

1

Validation properties can be found on AbstractControl instances. So you need to mark your form tag and then get a particular control from its controls property:

<form #myFrom="ngForm">
    <input name="myInput{{user.id}}">
    {{ myForm.controls['myInput' + user.id]?.dirty }}
</form>

answered Apr 3, 2017 at 14:19

Ján Halaša

8,4961 gold badge40 silver badges37 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

LiverpoolOwen Over a year ago

Ok but how would I apply this to a butt9n like in my example

Ján Halaša Over a year ago

You can use the "myForm.controls..." (boolean) expression in the *ngIf of the button.

Collectives™ on Stack Overflow

How to use Angular validation properties inside for?

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related