如何將按鈕ID傳遞到離子2中的新頁面

所以我試圖做一些可能很簡單的事情，但我無法破解它。如何將按鈕ID傳遞到離子2中的新頁面

在Ionic 2框架中，我想使用navCtrl.push將列表中的按鈕ID傳遞到新頁面，以便點擊的按鈕將成爲我推送到的頁面的標題。

我的HTML是這樣的：

<ion-item-group> 
     <ion-item-divider color="light">B</ion-item-divider> 
     <button (click)="dealPage1($event, button)" #button id="Bier 
     Markt" class="button" ion-item >Bier Markt 
      <ion-avatar item-left> 
      <img src="https://s3- 
      media3.fl.yelpcdn.com/bphoto/SaoAO5b2w35dyG460PGc7Q/ls.jpg"> 
      </ion-avatar> 
     </button> 
    </ion-item-group>

和我的TS是這樣的：

dealPage1(event, button) { 

let data = { 
    pagetitle: 'Bier Markt', 
    id: button.id, 
    title: 'Drinks for Two', 
    subtitle: 'By One Cocktail, Get One Free', 
    image: 'http://notable.ca/wp-content/uploads/2015/06/canada-day-cocktails.jpg' 
}; 

this.navCtrl.push(DealPage, data); 
console.log(button.id);}

目前我的交易網頁上的所有字符串傳遞沒有問題，但該ID被作爲數字傳遞8，而不是我需要「Bier Markt」的字符串。我一直試圖讓這工作在過去的幾個小時，但我無法弄清楚。

任何幫助將非常感激。

來源

2017-05-05 LordofX

通過應用ion-item屬性將按鈕元素更改爲離子組分。

我們得到Item ref，所以我們需要找到我們的按鈕。

嘗試用button._elementRef.nativeElement.id行傳遞一個id。

來源

2017-05-05 16:09:15

謝謝！這100％得到了數據流，但它導致我另一個問題。當我重複多個項目的上述結構（基本上是一個按鈕列表）時，它只會傳遞列表中最後一個項目的ID。因此，例如，如果我有#button id =「1」，#button id =「2」，#button id =「3」等，所有點擊按鈕都有「3」作爲id傳遞。它似乎總是設置爲最終列表項。 – LordofX

如何將按鈕ID傳遞到離子2中的新頁面

回答

相關問題