[解決済み] Angular 2でクリックイベント時に関数を呼び出す

質問

Angular 2でコンポーネント（typescript）内の関数を宣言し、クリックイベントでそれを呼び出すにはどうすればよいですか？ 以下は、私がAngular 2のコードを必要とするAngular 1の同じ機能のためのコードです。

<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) { ... }