Angular JS离子搜索框带有清除字段按钮

Sol*_*ole 2 javascript angularjs ionic-framework

我的应用程序正在使用离子和角度js ..我正在尝试为搜索添加一个清晰的按钮,但它不起作用?..我的代码是:

HTML:

  <div class="item item-input-inset">
    <label class="item-input-wrapper">
      <input type="text" placeholder="Search" ng-model="search">
    </label>
    <button class="button ion-android-close input-button button-small"
              ng-click="clearSearch()" ng-if="search.length">
            </button>

  </div>
Run Code Online (Sandbox Code Playgroud)

APP.JS

  $scope.clearSearch = function() {
   $scope.search = '';
 };
Run Code Online (Sandbox Code Playgroud)

也许我需要更多东西,但这不起作用?

有什么帮助谢谢?

thl*_*brg 8

问题在于ng-if使用ng-show代替.

<div class="item item-input-inset">
    <label class="item-input-wrapper">
      <input type="text" placeholder="Search" ng-model="search">
    </label>

    <button ng-click="search = ''" class="button ion-android-close input-button button-small" ng-show="search.length">Clear
    </button>
</div>
Run Code Online (Sandbox Code Playgroud)