Ionic 3 按钮在离子内容中不可点击答案

【问题标题】：Ionic 3 Buttons are not clickable within ion-contentIonic 3 按钮在离子内容中不可点击
【发布时间】：2018-01-10 20:25:47
【问题描述】：

我有一些在离子内容中不可点击的按钮。当我把它们拿出来时，它们工作得很好。这是我的 HTML 和 SCSS。非常奇怪的行为，也许我错过了什么？

<ion-content no-bounce>
  <div class="content_cover_exit">
    <button class="exit-button" (click)="logoutUser()">
      <ion-icon name="ios-exit-outline" class="icon-exit-class"></ion-icon>
      EXIT
    </button>
  </div>
</ion-content>


  .content_cover_exit {
    width: 100%;
    text-align: center;
    position: fixed;
    bottom: 70px;
    z-index: 9999;
    margin-bottom: constant(safe-area-inset-bottom);
    margin-bottom: env(safe-area-inset-bottom);
  }
  .exit-button {
    height: 2.0em;
    border-radius: 5px;
    opacity: 100%;
    background-color: white;
    font-size: 0.8em;
    font-weight: 400;
    letter-spacing: 1.2px;
    color: $dark-text;
    z-index: 999999;
  }
  .exit-button.activated {
    background-color: white;

  }
  .icon-exit-class {
    color: $dark-text;
  }

更新：进一步的研究表明，即使 *ngIf 也不起作用！这乞求看起来超级奇怪！

【问题讨论】：

有什么特殊原因不使用ion-button 属性？
@SurajRao 它也不适用于它。所以不，我以前有过。

标签： ionic-framework ionic3

【解决方案1】：

只需将 ion-button 指令添加到您的按钮标签，它就会正常工作。

ionic 使用 ion-button 指令添加了一些增强功能。

<ion-content no-bounce>
  <div class="content_cover_exit">
    <button ion-button class="exit-button" (click)="logoutUser()">
      <ion-icon name="ios-exit-outline" class="icon-exit-class"></ion-icon>
      EXIT
    </button>
  </div>
</ion-content>

【讨论】：

你能告诉我你在哪里使用这个 html。分享更多细节以提供帮助
In and Ionic 3 App，在 iPhone 上测试（所有版本）。在一个基本的 Ionic 页面中。这在浏览器中工作正常，仅在设备/模拟器上不起作用。

【解决方案2】：

这样试试

 <ion-content no-bounce>
      <div class="content_cover_exit">
       <button class="exit-button"(click)="exitApp()">
          <ion-icon name="ios-exit-outline" class="icon-exit-class"></ion-icon>
          EXIT
      <button>
      </div>
    </ion-content>

和你的

.ts

import {Platform} from 'ionic-angular';

export MyPage {


constructor(platform: Platform) {
    this.platform = platform;
  }
exitApp(){
 this.platform.exitApp();

} }

【讨论】：