我创建了如下模板
<ion-header-bar class="bar-light bar-subheader bar bar-header item-input-inset">
<label class="item-input-wrapper">
<i class="icon ion-ios7-search placeholder-icon"></i>
<input type="search" ng-model="search" placeholder="select city...">
<button ng-if="search.length" class="customIcon button button-icon ion-close-circled input-button"></button>
</label>
<button class="button button-clear">Cancel</button>
</ion-header-bar>
我的问题是,当我将下面的代码放在标签内的按钮下面时,它将不起作用,但是如果我将相同的代码放在标签外的按钮内,它将起作用
ng-click="search=''"
最佳答案
问题在于ngIf
指令创建了一个新的子作用域,因此search=''
成为本地子作用域属性search
,它与您要使用的父作用域search
模型无关。
最简单的解决方法是使用ngShow
代替,它仅隐藏按钮,但处理相同的作用域:
<button ng-show="search.length" ng-click="search=''" class="customIcon button button-icon ion-close-circled input-button"></button>
您也可以使用父范围参考:
ng-if="search.length" ng-click="$parent.search=''"
克服它,但是不建议这样做。