我在AngularJS项目中集成了分页和排序。我想使用用户的选择根据每个项目的页面显示数据。当我整合这个东西时,我遇到了更新范围变量的问题。这是我的代码:
<div dir-paginate="partners in partnersData|orderBy:orderByField:reverseSort |filter:{name: partners.name, website: partners.website, location: partners.location}|itemsPerPage: limitData as filteredArray" current-page="currentPage">
<div class="rowDiv">
<div class="cellDiv"><span ng-click="makeFavourite(partners)" class="star_rating" ng-class="{'select':partners.select}"></span> <span ng-click="showImage($index)"></span></div>
<div class="cellDiv" ng-click="showName($index)">{{partners.name}}</div>
<div class="cellDiv" ng-click="openWebsite(partners.website)">{{partners.website}}</div>
<div class="cellDiv">{{partners.location}}</div>
<div class="cellDiv">{{partners.service}}</div>
<div class="cellDiv">{{partners.connection}}</div>
<div class="cellDiv">{{partners.action}}</div>
<div class="cellDiv lastCell"><span class="icon_pluse" ng-click="openPlus($index)"></span><span class="icon_info" ng-click="openInfo($index)"></span></div>
我已将分页文件和每页项目包括在内:
<dir-pagination-controls boundary-links="true" on-page-change="pageChangeHandler(newPageNumber)" template-url="templates/dashboard/dirPagination.tpl.html"></dir-pagination-controls>
这是dirPagination.tpl.html文件:
<select class="filterSelect" ng-options="limits.value as limits.value for limits in availableLimits" ng-model="limits" ng-change="selectLimit()">
<!--<option style="display:none" value="">Select</option>-->
</select>
控制器代码:
$scope.currentPage = 1;
$scope.limitData = 1;
$scope.selectLimit = function ()
{
//console.log($scope.limits);
var limits = $scope.limits
$scope.limitData = limits;
};
答案 0 :(得分:0)
请参考此代码。它工作正常。
http://plnkr.co/edit/Wtkv71LIqUR4OhzhgpqL?p=preview
var sharedAccessPolicy = {
AccessPolicy: {
Permissions: 'w',
Expiry: azure.date.minutesFromNow(5)
}
}
答案 1 :(得分:0)
这是Angular或Javascript中范围继承的问题。详细了解here。
要解决您的问题,请先定义一个这样的对象:
$scope.modelData = {};
$scope.modelData.currentPage = 1;
$scope.modelData.limitData = 1;
$scope.selectLimit = function() {
$scope.modelData.limitData = $scope.limits;
};
现在,更新你的视图以使用新对象$scope.modelData
(我在一个地方写它,你可以在其他地方修复它,如果有的话):
<div dir-paginate="partners in partnersData|orderBy:orderByField:reverseSort |filter:{name: partners.name, website: partners.website, location: partners.location}|itemsPerPage: modelData.limitData as filteredArray"
current-page="modelData.currentPage"></div>
定义一个对象$scope.modelData
并使用它所有的位置将消除由repeat
表达式创建的嵌套作用域的问题。
答案 2 :(得分:-1)
你错过了一个“;”在var limits = $scope.limits
的末尾?有时JS会因为这些类型的错误而让你发疯。