如何在此函数中使用 webService。 $resource, angularjs?

Question

我有以下控制器，可以用 DataTable 填充 table。但是我在那里使用了一个 json 数组，我想使用一个 returns 一个 json 对象的网络服务。 http://localhost:8080/system/public/ws/users。它 returns 一个鼻子对象数组，因为我在该函数中使用它来填充 table.

> .controller('dt_default',
    function($compile, $scope, $timeout, $resource, DTOptionsBuilder, DTColumnDefBuilder, $http) {
        var vm = this;
        vm.dt_data = [];
        vm.dtOptions = DTOptionsBuilder
            .newOptions()
            .withDisplayLength(10)
            .withOption('initComplete', function() {
                $timeout(function() {
                    $compile($('.dt-uikit .md-input'))($scope);
                })
            });
        vm.dtColumnDefs = [
            DTColumnDefBuilder.newColumnDef(0),
            DTColumnDefBuilder.newColumnDef(1),
            DTColumnDefBuilder.newColumnDef(2),
            DTColumnDefBuilder.newColumnDef(3),
            DTColumnDefBuilder.newColumnDef(4),
            DTColumnDefBuilder.newColumnDef(5)
        ];
        $resource('data/dt_data.json') 
           /* Here I get the json.
            * How can I use the webservice that returns an array of objects. 
            * Json with has only arrays
            */
            .query()
            .$promise
            .then(function(dt_data) {
                vm.dt_data = dt_data;
                console.log(dt_data);
            });

还有 html 我必须这样做。

<tr ng-repeat="row in showCase.dt_data">
                        <td>{{row[0]}}</td>
                        <td>{{row[1]}}</td>
                        <td>{{row[2]}}</td>
                        <td>{{row[3]}}</td>
                        <td>{{row[4]}}</td>
                        <td> 
                         <a href="#" data-uk-modal="{target:'#modal_header_footer'}"><i class="md-icon material-icons md-bg-light-blue-900 uk-text-contrast"></i></a>
                         <a href="#" data-uk-modal="{target:'#modal_header_footer_eliminar'}"><i class="md-icon material-icons md-bg-red-900 uk-text-contrast">&#xE872;</i></a>
                         </td>
                    </tr>

Answer 1

使用此代码：

看看这个页面：Documentation

.controller('dt_default',
    function($compile, $scope, $timeout, $resource, DTOptionsBuilder, DTColumnDefBuilder, $http) {
        var vm = this;
        vm.dt_data = [];
        vm.dtOptions = DTOptionsBuilder
            .newOptions()
            .withDisplayLength(10)
            .withOption('initComplete', function() {
                $timeout(function() {
                    $compile($('.dt-uikit .md-input'))($scope);
                })
            })
            .withOption('ajax', {
                url: 'http://localhost:8080/system/public/ws/users',
                type: 'GET',
            })
            .withOption('processing', true)
            .withOption('serverSide', true);
           
        vm.dtColumns = [
          DTColumnBuilder.newColumn('id').withTitle('ID'),
          DTColumnBuilder.newColumn('firstName').withTitle('First name'),
          DTColumnBuilder.newColumn('lastName').withTitle('Last name'),
            DTColumnBuilder.newColumn(null).withTitle('Option').renderWith(data, type, full) {
            var el = '<a href="#" data-uk-modal="{target:\'#modal_header_footer\'}"><i class="md-icon material-icons md-bg-light-blue-900 uk-text-contrast"></i></a>';
            })
      ];

<div ng-controller="dt_default as dt_default">
    <table datatable="" dt-options="dt_default.dtOptions" dt-columns="dt_default.dtColumns" class="row-border hover"></table>
</div>

如何在此函数中使用 webService。 $resource, angularjs?

How to use a webService in this function. $resource, with angularjs?

datatable

angularjs

angular-datatables