ionic2離子列表一個按鈕均具有（點擊）事件

Question

當我點擊下載按鈕，它應該做財產以後其他關於這一項目的點擊時，它應該打開一個新的窗口，我想實現是

<ion-list> 
    <ion-item *ngFor="let reading_material of reading_materials" (click)="gotoReadingMaterial(reading_material)"> 
     {{reading_material.title}} 
     <ion-icon item-right name="download" (click)="downloadMaterial(reading_material)"></ion-icon> 
    </ion-item> 
</ion-list> 

但是當我點擊下載按鈕時，這兩個事件都會被擊中。 當我點擊下載按鈕時，是否有辦法抑制項目事件？

Answer 1

您可以通過使用event.stopPropagation();來解決此問題。請致電this plunker。

就像你可以看到，我也送$event對象這兩種方法

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

然後我使用該信息來阻止事件的傳播，所以只能下載方法將被執行，當點擊下載圖標

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

    public download(event, item) { 
    event.stopPropagation(); 
    alert('Download ' + item); 
    }