如何在Ionic 2中将按钮ID传递给新页面

时间:2017-05-05 14:40:47

标签: angularjs ionic-framework ionic2

所以我试图做一些可能非常简单的事情,但我无法破解它。

在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传递,而不是我需要的字符串&#34; Bier Markt&#34;。我一直在努力让这个过去几个小时上班和下班,但我无法弄明白。

任何帮助都会非常感激。

1 个答案:

答案 0 :(得分:0)

您通过应用ion-item属性将button元素更改为离子组件。

我们收到Item参考号,因此我们需要找到我们的按钮。

尝试使用button._elementRef.nativeElement.id行传递ID。