当使用ng-show或ng-hide显示/隐藏包含列表的部分时,它的行为正常.使用ng-if时,无法过滤列表.
演示
> This version does not work due to the use of ng-if
> This version does work due to the use of ng-show
示例HTML
<nav> <a href="javascript:{}" ng-click="area='one';">Area 1</a> <a href="javascript:{}" ng-click="area='two';">Area 2</a> </nav> <div ng-if="area==='one'"> <h3>Area 1!</h3> <input type="text" placeholder="filter list..." ng-model="filterText" /> <ul> <li ng-repeat="item in list | filter: listFilter"> {{item.id}} - {{item.name}} </li> </ul> </div> <div ng-if="area==='two'"> <h3>Area 2!</h3> <p>Stuff here...</p> </div>
示例角度
$scope.area="one"; $scope.filterText=""; $scope.list = [ {id:1,name:"banana"},{id:2,name:"apple"},{id:3,name:"orange"},{id:4,name:"pear"},{id:5,name:"apricot"} ]; $scope.listFilter = function(item){ var term = $scope.filterText.trim().toLowerCase(); return item.id.toString().indexOf(term) > -1 || item.name.indexOf(term) > -1; };
>数量
>字符串
>布尔值
> null
>未定义
>符号(自ES6起)
被认为是primitives (MDN).
现在 – 当您从父作用域继承’基元时,实际发生的是子作用域“镜像”或“遮蔽”给定的原始值.因此,您可以将其视为上述的副本.
这大致是原型继承语境中原语的本质.
这可以在modified version of your broken fiddle中清楚地观察到.
尝试使用两个输入进行播放,当您只触摸外部输入时(即子值’遮蔽’父值),您可以看到两个值之间存在连接.但是一旦触摸内部输入,值就会相互脱离.
推荐的解决方法是使用对模型上的属性的引用(我说模型,但实际上它只是一个JS对象),它在原型链的进一步定义;
$parentScope.obj = { filterText: '' }; ng-model="obj.filterText"
现在你应该好好使用ngIf,ngSwitch,ngRepeat来命名一些创建新范围的角度提供的指令.
有关该主题的资源
> understanding scopes @ angular
> presentation by misko on the subject
> stackoverflow answer by Mark Rajcok
> the dot @egghead.io
> google search ‘dot ng model’
原文地址:https://www.jb51.cc/angularjs/141910.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。