Angular2のクリックイベントで関数を呼び出す

コンポーネント（typescript）内で関数を宣言し、Angular 2のクリックイベントでそれを呼び出す方法は？以下は、Angular2コードが必要なAngular1の同じ機能のコードです。

<button ng-click="myFunc()"></button>

//コントローラ

app.controller('myCtrl', ['$scope', function($cope) {
    $scope.myFunc= {
        console.log("function called");
    };
}]);

コンポーネントコード：

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

@Component({
  templateUrl:"home.html"
})
export class HomePage {

  public items: Array<string>;

  constructor() {
    this.items = ["item1", "item2", "item3"]
  }

  public open(event, item) {
    alert('Open ' + item);
  }

}

見る：

<ion-header>
  <ion-navbar primary>
    <ion-title>
      <span>My App</span>
    </ion-title>
  </ion-navbar>
</ion-header>

<ion-content>
  <ion-list>
    <ion-item *ngFor="let item of items" (click)="open($event, item)">
      {{ item }}
    </ion-item>
  </ion-list>
</ion-content>

コードでわかるように、私はこのようにクリックハンドラーを宣言し、(click)="open($event, item)"イベントとアイテム（で宣言されている*ngFor）の両方をopen()メソッド（コンポーネントコードで宣言されている）に送信しています。

アイテムを表示したいだけで、イベントから情報を取得する必要がない場合は(click)="open(item)"、次のようにopenメソッドを実行および変更できます。public open(item) { ... }

Angular2 +への正確な転送は次のとおりです。

<button (click)="myFunc()"></button>

コンポーネントファイルにも：

import { Component, OnInit } from "@angular/core";

@Component({
  templateUrl:"button.html" //this is the component which has the above button html
})

export class App implements OnInit{
  constructor(){}

  ngOnInit(){

  }

  myFunc(){
    console.log("function called");
  }
}

https://angular.io/guide/user-input- 簡単な例があります。

コントローラコードの行は、次のように$scope.myFunc={なります$scope.myFunc = function() {。function()一部であることを示すことが重要です。これは関数です。

更新されたコントローラーコードは

app.controller('myCtrl',['$scope',function($cope){
    $scope.myFunc = function() {
    console.log("function called");
  };
}]);

これは私のために働いた：:)

<button (click)="updatePendingApprovals(''+pendingApproval.personId, ''+pendingApproval.personId)">Approve</button>

updatePendingApprovals(planId: string, participantId: string) : void {
  alert('PlanId:' + planId + '    ParticipantId:' + participantId);
}