CODEWITHSUNDEEP
htmlangulartypescript
Sukumar MS
Sukumar MS

Reputation: 748

what is the best practice to call a function in html using angular2?

i am calling a function using html binding expression(template interpolation) in angular2 while doing this the console statements are printing continuously. Is this is the only way to do or any different ways to call a function in html. i have use the similar syntax in angularjs-v1 have no issues! any suggestions will be appreciated. Thanks!

html

 <button ion-button (click)="addProduct(totalSingleItem,getTotalItemPrice(totalSingleItem))" >addProduct
          <span>: {{getTotalItemPrice(singleItem) * singleItem.quantity}}</span>
      </button>

ts

private getTotalItemPrice(ITEM) {
return totalPrice; //(eg: 75$)

}

Upvotes: 2

Views: 1017

Answers (1)

JSON Derulo
JSON Derulo

Reputation: 17603

Create a custom pipe for that purpose.

TS:

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({name: 'getTotalItemPrice'})
export class GetTotalItemPrice implements PipeTransform {
  transform(item: any, quantity: number): number {
    let totalPrice: number = 0;
    // your logic
    return totalPrice;
  }
}

Template:

{{singleItem | getTotalItemPrice: singleItem.quantity}}

Upvotes: 5

Related Questions