$ scope问题与gridOptions,angular-ui-grid和来自服务的REST调用

时间:2015-03-05 15:54:33

标签: json angularjs angular-ui-grid

我似乎在让我的ng-grid指令从返回的REST api json obj中填充时出现问题。 我已经确认返回了一个有效的json obj,并且我检索了一个我需要的数据的嵌套obj。它似乎没有进入gridOptions函数。其中myData是正确的有效json。 任何帮助将不胜感激。我此刻正在拔头发。 这是我的服务: 网格service.js

'use strict';
app.factory('GridService', ['$http', '$q', function($http, $q) {
    var apiUrl = "http://xx.xx.xx.xx/coName/public/index.php/";

// configure the send request
function sendRequest(config){
    var deferred = $q.defer();
    config.then(function(response){
        deferred.resolve(response);
    }, function(error){
        deferred.reject(error);
    });
    return deferred.promise;
}

// retrieve all
function getRoles() { 
    var request = $http({
        method: 'GET',
        url: apiUrl + 'roles'
    }); 
    return sendRequest(request);
}

return {        
    getRoles: getRoles                
};
}]);

我将它注入我的ctrl,以及我的init函数和gridOption函数:

app.controller('ModuleCtrl', [ '$scope', '$http', '$modal', '$filter', 'GridService', function($scope, $http, $modal, $filter, gridService) {
    var initializeGrid = function(){        
    getRoles(); 
};
var getRoles = function(){
    gridService.getRoles().then(function(myRoles){
    var myRolesData = myRoles.data._embedded.roles;            
    $scope.myData = myRoles.data._embedded.roles;
    console.log($scope.myData);
});
};
$scope.gridOptions = {
    data: 'myData',
    enableRowSelection: true,
    enableCellEditOnFocus: true,
    showSelectionCheckbox: true,
    selectedItems: $scope.selectedRows,
    columnDefs: [{
       field: 'ID',
       displayName: 'Id',
       enableCellEdit: false
    }, {
       field: 'APP_ID',
       displayName: 'Module ID',
       enableCellEdit: false
    }, {
       field: 'RLDESC',
       displayName: 'Role Description',
       enableCellEdit: true
    }, {
        field: 'APDESC',
        displayName: 'Module Description',
        enableCellEdit: true
    }, {
        field: 'ZEND_DB_ROWNUM',
        displayName: 'Record number',
        enableCellEdit: false
    }]
};            
// fire it up
initializeGrid();
}

我完整的json:

{
"_links": {
    "self": {
        "href": "http://xx.xx.xx.xx/coName/public/index.php/roles?page=1"
    },
    "describedBy": {
        "href": "Some Fun Stuff"
    },
    "first": {
        "href": "http://xx.xx.xx.xx/coName/public/index.php/roles"
    },
    "last": {
        "href": "http://xx.xx.xx.xx/coName/public/index.php/roles?page=1"
    }
},
"_embedded": {
    "roles": [
        {
            "ID": 1,
            "APP_ID": 1,
            "RLDESC": "Admin",
            "APDESC": "authLive",
            "ZEND_DB_ROWNUM": "1"
        },
        {
            "ID": 2,
            "APP_ID": 1,
            "RLDESC": "User",
            "APDESC": "authLive",
            "ZEND_DB_ROWNUM": "2"
        },
        {
            "ID": 4,
            "APP_ID": 1,
            "RLDESC": "SuperUser",
            "APDESC": "authLive",
            "ZEND_DB_ROWNUM": "3"
        }
    ]
},
"page_count": 1,
"page_size": 25,
"total_items": 3
}

1 个答案:

答案 0 :(得分:1)

从gridOptions

中删除以下行
data: 'myData'

然后在getRoles()中使用

$scope.gridOptions.data = myRolesData;

而不是

$scope.myData = myRoles.data._embedded.roles;

(也许你需要$ scope.myData除了网格以外的其他原因,但如果没有,我认为以上就是你所需要的。我没有测试过这个,但它应该有效。)