How to push input-values into chips?

@Caturix99 wrote:

I want to store my inputed strings in chips. I managed to just push labels but then I have the problem, that every new value gets overridden by the new one and when I try to do it with chips, just empty chips are created. Even tough I believe the first problem isn’t yet.

page.html

<ion-chip outline (click)="remove(chip)" color="favorite" class="chip" *ngFor="let tag of tagName">
   

    <ion-label>{{tag.myVal1}}</ion-label>
     
       <ion-icon name="close-circle"></ion-icon>
     
       </ion-chip>
   
    <ion-item lines="none">
        <ion-input type="text" text-right maxLength="10" placeholder="Tags" [(ngModel)]="myVal"></ion-input>
        <ion-button class="adder" color="danger" (click)="add(chip)">
            <ion-icon name="add"></ion-icon>
       </ion-button>
        
      </ion-item>

page.ts

export class Tag {
  tag: string;
  constructor(values: Object = {}) {
    Object.assign(this, values);
  }
}



  tagName: Tag[] = [];
  myVal: string = "";
  myVal1: string = "";

constructor() {}

add(): void {
    let id = this.tagName.length + 1;
    this.tagName.push(new Tag({ tag: "myVal1" + id, color: this.color[this.getRandomInt(this.color.length)] }, ));
  }

  remove(tag: Tag) {
    let id = this.tagName.indexOf(tag);
    this.tagName.splice(id, 1);
  }


  getRandomInt(max) {
    return Math.floor(Math.random() * Math.floor(max));
  }

 
  refresh()
  {
  	this.myVal1 = this.myVal;
  }

Posts: 1

Participants: 1

Read full topic