Breaking News: Grepper is joining You.com. Read the official announcement!

removing an item from a list typescript

Wiley Wombat answered on September 1, 2022 Popularity 9/10 Helpfulness 4/10

answer removing an item from a list typescript

removing an item from a list typescript

Comment

//html
 <div class="row" *ngFor="let i of cartInfo" style="margin-bottom:20px;">
        <div class="col-md-3">
          <label style="font-size:20px;">{{i.itemName}}</label>
        </div>
        <div class="col-md-2">
          <label style="font-size:20px; width:100%; text-align:end">
            <button mat-fab class="dltBtn" aria-label="Example icon button with a delete icon" (click)="removeItemFromCart(i.id)">
              <mat-icon>delete</mat-icon>
            </button>
          </label>
        </div>
      </div>

//ts
export interface cartData {
  id: number;
  itemName: string;
}

@Component({
  selector: 'app-cart',
  templateUrl: './cart.component.html',
  styleUrls: ['./cart.component.css']
})
export class CartComponent implements OnInit {

  cartInfo: cartData[] = [
    {id:1, itemName: "Item 1"  },
    { id: 2, itemName: "Item 2" },
    {id:3, itemName: "Item 3"  },
    {id:4, itemName: "Item 4"  },
    {id:5, itemName: "Item 5" },
  ]


  removeItemFromCart(indx: number) {
    this.cartInfo.forEach((value, id) => {
      if (value.id == indx) this.cartInfo.splice(id, 1);
    });
  }

  constructor() { }

  ngOnInit(): void {
  }

}

Popularity 9/10 Helpfulness 4/10 Language typescript

Source: www.angularjswiki.com

Tags: list typescript

Link to this answer
Share Copy Link

Contributed on Sep 01 2022

Wiley Wombat

0 Answers Avg Quality 2/10

removing an item from a list typescript

Contents

More Related Answers

removing an item from a list typescript

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.