[英]AngularJS dynamic sort function with parameters
基于AngularJS 中的 Dynamic orderBy我尝试使用参数实现动态排序 function。 它无法正常工作,因为正在调用默认排序。 如何使它不按名称调用默认排序?
我有 2 个按钮可以调用 function 并发送参数。
<button ng-click="dynamicOrder('f9.id')" class="btn">Sort by rating</button>
<button ng-click="dynamicOrder('name')" class="btn">Sort alphabetic</button>
我的 ng-repeat 看起来像这样:
<li ng-repeat="item in cumulus.items | orderBy: dynamicOrder()"
ng-show="cumulus.items.length > 0" class="block-grid-item">
<p>
<a target="_blank" href="{{ item.image }}">
<img class="img-responsive" src="{{ item.thumb }}">
</a>
</p>
<p style="overflow: hidden;">{{ item.name }}</p>
<p class="text-primary"><input type="hidden" value="{{ item.f9.id }}" /> {{ item.f9.displaystring }}</p>
</li>
和我的 function 订购
$scope.dynamicOrder = function (sortParam) {
if (!sortParam) {
return 'name';
} else {
console.log("sortParam: ", typeof (sortParam), sortParam);
return sortParam;
}
};
orderBy
表达式可以是 getter function。 这个 function 将以每个项目作为参数调用,返回值将用于排序。
$scope.getterFn = function(item) {
if ($scope.dynamicOrder == 'f9.id') {
return item.f9.id;
} else if ($scope.dynamicOrder == 'name') {
return item.name;
} else {
return item;
}
};
用法:
<button ng-click="dynamicOrder = 'f9.id'" class="btn">Sort by rating</button>
<button ng-click="dynamicOrder = 'name'" class="btn">Sort alphabetic</button>
<li ng-repeat="item in cumulus.items | orderBy: getterFn">
<!-- ... -->
</li>
有关详细信息,请参阅
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.