Kedar Udupa
Kedar Udupa

Reputation: 554

How do I pass multiple parameters to an @Input decorator function in Angular 4

My Input decorator looks like this

    @Input()
   filler(itemName:any,itemRate:number,itemQty:number,itemDiscount:number,itemSubtotal:number)
{
 this.cart.push({name:itemName,rate:itemRate,qty:itemQty,discount:itemDiscount,subtotal:itemSubtotal});
  }

and the call looks like this

<app-bill [filler]="['Name','Rate', 'Qty', 'Discount', 'Subtotal']"></app-bill>

and I need to pass all those 5 values to the "filler()".

Upvotes: 0

Views: 2294

Answers (1)

Sajeetharan
Sajeetharan

Reputation: 222532

Create a object of that type and pass the values,

<app-bill [filler]="item"></app-bill>

where item is created from class which has all the fields

Item.ts

class Item {
    Name: string;
    Rate: number;
    Qty : number;
    Discount : number;
    SubTotal: number;
}

In your Catalog Component.ts

import { Item } from 'Item';

 export class CheckOutPageComponent{
 item : Item;
 ngOnInit() {
        item.Name = 'test';
        ,,,,,,assign rest of values here
 }

Upvotes: 2

Related Questions