在获取数据之前呈现Angularjs数据表

Question

angular.module('SomeApp').controller('userListsCtrl',userListsCtrl);

function userListsCtrl(DTOptionsBuilder,DTColumnBuilder,$http,$q) {
    var vm = this;
    function serverData() {
        var defer = $q.defer();
        $.ajax({
            'dataType': 'json',
            'type': 'POST',
            'contentType': 'application/json',
            'url': 'cgi/userNavLists.py',
            'data': JSON.stringify({'request':"INPROCESS"}),
            'success': function(data, textStatus, jqXHR, fnCallback){
                console.log("User Table Data Coming Up");
                console.log(data);
                defer.resolve(data);
            },

        });

        return defer.promise;
    }

   serverData().then(function(data){
        console.log("Promise Data");
        console.log(data);
   });
    vm.dtOptions = DTOptionsBuilder.fromSource('cgi/userNavLists.py').withFnServerData(serverData);
                console.log("User Table Data Coming Up123");
    console.log(vm.dtOptions);
    vm.dtColumns = [
        DTColumnBuilder.newColumn('requestId').withTitle('ID'),
        DTColumnBuilder.newColumn('requestType').withTitle('Type'),
        DTColumnBuilder.newColumn('identifier').withTitle('Identifier'),
        DTColumnBuilder.newColumn('domainName').withTitle('Domain Name'),
        DTColumnBuilder.newColumn('recordType').withTitle('Record Type'),
        DTColumnBuilder.newColumn('state').withTitle('State'),
    ];


}

我正在尝试从服务器呈现表提取数据。但是我的表在获取数据之前正在进行渲染。我曾使用承诺来完成这项工作，但似乎无法解决我的问题。他们是一种可以让它发挥作用的方式吗？

Answer 1

您必须与异步响应一起创建对象：

angular.module('SomeApp').controller('userListsCtrl',userListsCtrl);

function userListsCtrl(DTOptionsBuilder,DTColumnBuilder,$http,$q) {
    var vm = this;
    function serverData() {
        var defer = $q.defer();
        $.ajax({
            'dataType': 'json',
            'type': 'POST',
            'contentType': 'application/json',
            'url': 'cgi/userNavLists.py',
            'data': JSON.stringify({'request':"INPROCESS"}),
            'success': function(data, textStatus, jqXHR, fnCallback){
                console.log("User Table Data Coming Up");
                console.log(data);
                defer.resolve(data);
            },

        });

        return defer.promise;
    }

   serverData().then(function(data){
        console.log("Promise Data");
        console.log(data);
    vm.dtOptions = DTOptionsBuilder.fromSource('cgi/userNavLists.py').withFnServerData(serverData);
                console.log("User Table Data Coming Up123");
    console.log(vm.dtOptions);
    vm.dtColumns = [
        DTColumnBuilder.newColumn('requestId').withTitle('ID'),
        DTColumnBuilder.newColumn('requestType').withTitle('Type'),
        DTColumnBuilder.newColumn('identifier').withTitle('Identifier'),
        DTColumnBuilder.newColumn('domainName').withTitle('Domain Name'),
        DTColumnBuilder.newColumn('recordType').withTitle('Record Type'),
        DTColumnBuilder.newColumn('state').withTitle('State')
    ];
   });
}