Ionic 2 / Angular 2：Crossing click触发2个事件：on按钮及其后面的元素

Question

在移动设备上使用Angular 2（使用离子2），我有一个错误，我找不到任何类似的问题，所以我需要你的帮助。

上面有一个textarea和一个输入，当我点击输入时，键盘出现在上面的绝对块。在这个块中有一个按钮“关闭”，当我点击它时，它会触发hide（）方法以编程关闭键盘，这很有效，但在此之后，键盘出现焦点在textarea。 （“关闭”按钮位于textarea上方。）

似乎点击关闭按钮正在通过它并点击textarea。

在图像上，它是红色按钮。当我点击它时，键盘关闭，后面的textarea是焦点，有人知道为什么吗？

感谢。

编辑：

关闭按钮代码：

  public hide(){
      Keyboard.close();
  }

块的Html：

<ion-grid class="keyboard-accessory">
     <ion-row>
       <ion-col width-80>
         <button ion-button tappable clear class="cancel" (tap)="hide()"> <ion-icon ios="ios-close" md="md-close"></ion-icon></button>
         <input id="keyboardInput" #keyboardInput [(ngModel)]="text" (ngModelChange)="changeInputValue()" type="text"/>
         <p id="keyboardTitle"></p>
       </ion-col>
       <ion-col width-20>
         <button ion-button clear class="accept" (click)="validate()">Validate</button>
       </ion-col>
     </ion-row>
    </ion-grid>

我忘了说块是在离子页脚内部，而离子内容中的textarea，所以没有冒泡效果。 使用stopPropagation或preventDefault不起作用。

Answer 1

您可以使用css或减少文本区域的大小 使用自动调整大小 “npm install ionic2-autosize”。