CODEWITHSUNDEEP
angularangular5ngforng-template
Rafael Corzo
Rafael Corzo

Reputation: 1978

Angular 5 [ngForOf] shows only the last record on the loop

I can make the loop but I do not understand why it only shows me the value of the last record

invoice-list.html

<ng-template ngFor let-i [ngForOf]="invoiceService.selectedInvoice.purchases"> 
{{i.product.name | json}}   
   <input type="text" name="name" class="form-control" #pname="ngModel" [(ngModel)]="i.product.name" readonly>
</ng-template>

htmloutput

here's an example StackBlitz (login => user:[email protected] | pass: user123)

how go to this view? enter image description here

Upvotes: 0

Views: 499

Answers (1)

Julius Dzidzevičius
Julius Dzidzevičius

Reputation: 11000

Because you use two way binding NgModel which binds incoming value to the same variable - i.product.name. It doesn't makes much sense to use ngModel here. You export your form with #invoiceFrom='NgForm so you can do all validations there. Simply pass a value:

<input type="text" name="name" class="form-control [value]="i.product.name" readonly>

Upvotes: 1

Related Questions