Question

我已经在离子2中制作了一张卡片，如下所示。单击该卡后，它将转到另一个页面。

＆＃13;

<ion-content padding class="item item-text-wrap">
  <ion-list>
    <ion-item *ngFor='let topic of topicList' text-wrap (click)="redirect(topic)">
        <ion-thumbnail id="storyThumbnail">
          <img src="{{ topic.picDirectory }}">
        </ion-thumbnail>
        <div id="caption">
          <h2><strong>{{ topic.headline }}</strong></h2>
          <p id="artDate">{{ topic.date }}</p>
          <ion-icon name="bookmark" id="icon"></ion-icon>
          <!--<button id="viewButton" ion-button clear item-end  (click)="postItem(topic)">View</button>-->
          <ion-icon name="logo-facebook" id="icon"></ion-icon>
        </div>
    </ion-item>
  </ion-list>
</ion-content>

＆＃13;

当我按照指示（注释）添加按钮时，我无法单击该按钮。当我点击按钮时它反应就像我点击整张卡片一样，它调用redirect（）而不是postItem（）。该按钮将使用主题中的数据，因此我不能将它放在离子项之外，因为它包含ngFor但是当我把它放在离子项中时，我无法点击它。

按钮位于离子项后面，因此无法通过单击进行访问。有没有一种方法可以让它在项目内部点击它？

Answer 1

您在离子项级别添加了（点击）=“重定向（主题）”，代表整张卡，因此当您点击按钮时，它实际上点击整张卡片。

要解决此问题 - 您需要从离线项中移除（点击）事件调用并取消注释您的按钮代码，它应该可以正常工作。

请告诉我。

如何在Ionic 2中点击卡片中的按钮

1 个答案: