每次在输入中键入内容时，如何避免这种行为？

Question

我怎样才能避免this behavior？

如您所见，每次我输入内容时，右侧都会出现一个取消按钮 (x) 并且输入的高度会增加，这就是我想要避免的。

<ion-header-bar class="bar-positive bar-subheader">
  <label class="item-input-wrapper">
    <i class="icon ion-search placeholder-icon"></i>
    <input type="text"
           placeholder="Sports finder...">
    <button class="button button-clear"
            ng-click="query = ''">
      <div ng-show="query">
        <i class="ion-close-circled assertive animated flipInY"></i>
      </div>
    </button>
  </label>
</ion-header-bar>

我使用的代码完全相同

Answer 1

要自动回答我的问题，因为我刚刚做了，以防万一其他人有时间需要它。

我所做的一切：删除 label 并用相同的 classes 代替 div，并且完全删除 button。

<ion-header-bar class="bar-positive bar-subheader">
  <div class="item-input-wrapper">
    <i class="icon ion-search placeholder-icon"></i>
    <input type="text"
           placeholder="Sports finder...">
      <div ng-show="query" ng-click="query = ''">
        <i class="ion-close-circled assertive animated flipInY"></i>
      </div>
  </div>
</ion-header-bar>

每次在输入中键入内容时，如何避免这种行为？

How can I do avoid this behavior every time that I type something on the input?

html

ionic-framework