javascript - Bagaimana cara membuat ngFor dengan input di dalamnya agar tidak mengulang nilai yang diketik?


Saya perlu membuat beberapa input dengan ngFor tetapi ketika saya memasukkan sebuah kata, kata itu diulang di semua input yang ada, bagaimana saya bisa menyelesaikannya?

kode saya:

    <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>

Jawaban #1

Anda sedang mengikat variabel 'comment.text' ke setiap input [model]. Artinya, nilainya dibagikan antara semua lingkup input Anda. Anda perlu menggunakan 'publication', yang hanya berlaku untuk setiap input.

*ngFor="let publication of publications"

Ubah [(ngModel)]="comment.text" menjadi sesuatu seperti [(ngModel)]="publication.text"

Jawaban #2

Anda mengikat semua input ke satu properti comment.text. Anda seharusnya membuat satu properti untuk setiap input dan mengikat input dengannya.