lundi 26 novembre 2018

Add and remove values inside array in change event of checkbox

In my angular application, i am making a checkbox and capturing the checkbox change event and pushing the checked value into array..

Here if we uncheck the checkbox also the obj were pushed to the array..

How to remove the obj from array if uncheck the checkbox..

Html:

<div *ngFor="let item of order; let i = index">
  <input type="checkbox" [id]="item+i" [name]="item"[(ngModel)]="item.Checked" (change)="getCheckboxValues(item)">
   <label [for]="item+i">  </label>
</div>

Ts:

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

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  name = 'Angular';

  order = ['One','Two','Three','Four'];

  newArray : any = [];

  //Checkbox Change detecting function
  getCheckboxValues(data) {
    let obj = {
      "order" : data
    }

   // Pushing the object into array
    this.newArray.push(obj);

    //Duplicates the obj if we uncheck it
    //How to remove the value from array if we uncheck it
    console.log(this.newArray);
  }

}

The thing i have worked out with the above was in the link https://stackblitz.com/edit/angular-9pt9sn

Kindly help me to remove the unchecked values inside the ``newArray```..




Aucun commentaire:

Enregistrer un commentaire