Nrthugu

What I'm trying to do here is to dynamically add my input values for each input field onto my "tag" output. The problem I'm running into is that when I type and/or submit the values, all the input fields and "tag" outputs receive the same values. How can I fix this?

Thanks for taking the time in looking at this problem!

index.html


Note* - I cut most of the code down, just wanted to be direct as to what i need help with. The first line of code is to let you know that I am working within an *ngFor loop.

<div class="row" *ngFor="let student of students; let i = index">    

<ul *ngFor="let tag of tags">

  <li class="tag">{{ tag }}</li>

</ul>

<input

  type="text"

  name="tagInput"

  class="moreInfo tagInput"

  placeholder="Add a tag"

  [(ngModel)]="tagInput"

  (keydown.enter)="onAddTag($event)">

</div>

ts file

import { Component, OnInit } from '@angular/core';

import { FormsModule } from '@angular/forms';



tagInput = '';

tags = ;



onAddTag(event){

  this.tags.push(this.tagInput);

  this.tagInput = '';

}