Very Strange Issue about label!?

1

Hi , i have very strange problem,i don’t know why?
the code is simple:

controller:

.controller('ClubFindCtrl', function($scope,$ionicModal) {

    $ionicModal.fromTemplateUrl('templates/travelmate/club/modals/club_search_modal.html',{
      scope: $scope,
      animation: 'slide-in-down'
    }).then(function(modal) {
      $scope.search_club_modal = modal;
    });

    $scope.open_search_modal = function(){
      $scope.search_club_modal.show();
    };

    $scope.club_query_str = '';

    $scope.canClearQuery = function(){
        return $scope.club_query_str != '';
    };

    $scope.clearQuery = function(){
        console.log('clearQuery');
        //clear search results
    };

    $scope.cancelSearchClub = function(){
        console.log('clearQuery');
        $scope.search_club_modal.hide();
      //clear search results
    };

    $scope.$on('$destroy', function(modal) {
      $scope.search_club_modal.remove();
    });

})

the template is:

<ion-modal-view>
  <ion-header-bar>
    <div class="bar bar-header item-input-inset">
      <div class="item-input-wrapper">
        <i class="icon ion-ios7-search placeholder-icon"></i>
        <input type="search" 
               ng-model="club_query_str"
               placeholder="查找">
        <button class="button-clear icon ion-close-circled placeholder-icon"
                ng-click="clearQuery()"
                >
        </button>
      </div>
      <button ng-click="cancelSearchClub()" 
              class="button button-clear">取消</button>
    </div>
  </ion-header-bar>
  <ion-content>
  </ion-content>
</ion-modal-view>

if i change the template from div to label:

>   <label class="item-input-wrapper">
>     <i class="icon ion-ios7-search placeholder-icon"></i>
>     <input type="search" 
>            ng-model="club_query_str"
>            placeholder="查找">
>     <button class="button-clear icon ion-close-circled placeholder-icon"
>             ng-click="clearQuery()"
>             >
>     </button>
>   </label>

then the clearQuery defined in the controller will not be access!
Who can tell me , Why?!

2

Add type=“button” to the button. inside the label.

Related: