Question

我在angularjs中使用ng-grid。

当我第一次加载数据时（控制器加载时）数据到达OK。但是，当我在单击按钮后尝试刷新数据时，数据在UI中没有变化，但我在调试模式下看到范围中的数据发生了变化。

我忘记了什么吗？

我的HTML：

<div ng-controller="PurchaseOrderController">

    <div class="gridStyle"  ng-grid="gridOptions"></div>
    <input name="" type="button" value="search" class="search_button" ng-click="SearchOrders();"></div>

控制器：

        $scope.SearchOrders = function () {

        if (!$scope.DateFrom) {
            $scope.p1= "a";
        }
        if (!$scope.DateTo) {
            $scope.p2= "b";
        }

        $scope.getPagedDataAsync($scope.pagingOptions.pageSize, $scope.pagingOptions.currentPage);




    }//END OF SEARCH ORDERS
       $scope.filterOptions = {
        filterText: "",
        useExternalFilter: true
    };
    $scope.totalServerItems = 0;
    $scope.pagingOptions = {
        pageSizes: [5, 10, 20],
        pageSize: 10,
        currentPage: 5
    };

    $scope.setPagingData = function (data, page, pageSize) {
        var pagedData = data.slice((page - 1) * pageSize, page * pageSize);
        $scope.OrderData = pagedData;
        $scope.totalServerItems = data.length;
        if (!$scope.$$phase) {
            $scope.$apply();
        }
        $scope.$apply();
    };
    //END OF SERVER SIDE


    $scope.getPagedDataAsync = function (pageSize, page, searchText) {
        setTimeout(function () {
            OrderService.SearchOrders($scope.p1.Val, $scope.p2,
                $scope.SelectedOrder, $scope.SelectedPlant.Val, $scope.DateFrom, $scope.p3, $scope.p4).success(
                function (data) {
                    $scope.setPagingData(data, page, pageSize);
                });

            //$scope.setPagingData(data, page, pageSize); NEED TO BE RETURNED TO HTTP GET
        }, 100); //SET TIMEOUT
    };//END OF FUNCTION GET PAGED DATA

Answer 1

$scope.gridOptions = {
      data : 'OrderData',
           ...
}

这会监视范围变量并相应地更新数据。

数据从服务器到达后更新ng-grid UI

1 个答案: