0
634
ViewsHow do I make ngFor with input inside not repeat the typing value?
I need to make multiple inputs with ngFor but when I enter a word, it is repeated in all the inputs there are, how can I solve this?
my code:
<div class="" *ngFor="let publication of publications">
...
<form #newCommentForm="ngForm" (ngSubmit)="onSubmit(newCommentForm, $event, publication._id)">
<div class="make-comment" >
<img src="{{url+ 'get-image-user/' + publication.user.image }}" *ngIf="publication.user.image" class="rounded-circle-mini align-self-center">
<input type="text" name="#text" #text="ngModel" [(ngModel)]="comment.text" id="input-coment" class="form-control" required placeholder="Your comment">
<button class="btn btn-sm btn-secondary" style="color: #fff;" type="submit"><i class="bi bi-arrow-bar-left"></i></button>
</div>
</form>
</div>
·
Santiago Trujillo
2 answers
Answer question0
You're binding the variable 'comment.text' to every input [model]. Meaning, its value is shared between all your input scopes. You need to use 'publication', which is only scoped to each input.
*ngFor="let publication of publications"
Change [(ngModel)]="comment.text" to something like [(ngModel)]="publication.text"
·
Santiago Trujillo
Report
0
You are binding all inputs to a single property comment.text. You should create one property for each input and bind input with it.
·
Santiago Trujillo
Report
Answer question