使用angular2在html中调用函数的最佳实践是什么？

Question

我在angular2中使用html绑定表达式（模板插值）调用函数，同时执行此操作，控制台语句连续打印。 这是在html中调用函数的唯一方法或任何不同的方法吗？我使用angularjs-v1中的类似语法没有问题！任何建议将不胜感激。谢谢！

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$)

}

Answer 1

为此目的创建自定义管道。

TS：

package.json

模板：

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;
  }
}