AngularJS中未更新$ scope

时间:2016-01-20 06:59:15

标签: jquery angularjs

我在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;
    };

3 个答案:

答案 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会因为这些类型的错误而让你发疯。