如何动态更改数据提供程序时刷新角度JS表？

Question

我正在从服务器加载一些Json数据，并希望在角度表中显示它。我在我的桌子上使用xuiTable。 我的问题是，我加载的数据没有显示，对我来说似乎没有刷新表数据提供程序。 这是我的html和app.js代码。

＆＃13;

＆＃13;

<script src="resources/jquery/jquery-1.11.3.min.js"></script>
    <script src="resources/js/lib/angular/angular.min.js"></script>
    <script src="resources/js/lib/angular/angular.js"></script>
    <script src="resources/jquery/jquery-ui-1.11.4/external/jquery/jquery.js"></script>
    <script src="resources/jquery/jquery-ui-1.11.4/jquery.ui.widget.js"></script>
    <script src="resources/jquery/jquery-ui-1.11.4/jquery-ui.js"></script>
    <script src="resources/jquery/jquery.fileupload.js"></script>


    <script src='resources/js/pagination.js'></script>
    <script src='resources/js/xuiTable.js'></script>
    <script src="resources/js/app.js"></script>

    <link rel="stylesheet" href="resources/css/style.css" />
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css">
    <link data-require="bootstrap-css" rel="stylesheet" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap.min.css" />
    <link rel="stylesheet" href="resources/jquery/jquery-ui-1.11.4/jquery-ui.min.css">
    <link rel="stylesheet" href="resources/bootstrap/css/bootstrap.min.css"/>
    <link rel="stylesheet" href="resources/css/app.css"/>





<table xui-table="test" table-headers="TableHeader" table-data="List" items-per-page='10' page-window='PageSize' table-pager='true' table-filter='searchfn(input)' table-filter-factor='search'>
            <tbody>
            <tr>
                <td class="customerId">{{row.customerId }} </td>
                <td class="clusterId">{{row.clusterId}} </td>
                <td class="modelVersion">{{row.modelVersion}} </td>
            </tr>
            </tbody>
        </table>

＆＃13;

＆＃13;

＆＃13;

＆＃13;

＆＃13;

'use strict';

var bigspender = {};

var App = angular.module('bigspender',['xui.table']);



App.constant('TableHeader', [{
    header: 'customerId',
    title: 'Customer ID',
    sortable: true
}, {
    header: 'clusterId',
    title: 'Cluster ID',
    sortable: true
}, {
    header: 'modelVersion',
    title: 'Model Version',
    sortable: true
}

]);


App.controller("fileUploadController", function($scope, $http,TableHeader ) {

    $scope.name = 'World';
    $scope.TableHeader = TableHeader;
    $scope.List = [];

    $scope.search = {};

    /*
    *
    *
    *
    * for (var i = 1; i < 65; i++) {
     $scope.List.push({
     "customerId": "customerId" + i,
     "clusterId": "clusterId " + i,
     "modelVersion": "modelVersion " + i
     });


     }
    *
    *
    * */

    $scope.searchfn = function(input) {

        if ( !! input) {
            var tmp = false;
            angular.forEach($scope.search, function(val, key) {
                if ( !! (input[key].indexOf(val || '') !== -1)) {
                    tmp = true;
                }
            });
            return tmp;
        }
    };

    $scope.loader = {
        loading: false

    };

$scope.continueFileUpload=function () {
    var uploadUrl = "continueFileUpload";
    var formData = new FormData();
    formData.append('file', $('input[type=file]')[0].files[0]);
    $http({
        method: 'POST',
        url: uploadUrl,
        headers:{'Content-Type': false},
        data: formData,
        transformRequest: function(data, headersGetterFunction) {
            return data; // do nothing! FormData is very good!
        }
    })
        .success(function (data, status) {
           // alert("Your CSV file was uploaded successfully.");
            angular.element($('#showCluster')).show();
            $scope.loader.loading = true ;
        })
}
    $scope.reset = function(){
        $scope.loader.loading = false ;
    }
    $scope.clusterCustomers = function (){
        var url = "classify";
       var response = $http({
            method: 'GET',
            url: url

        })


        response.success(function(data, status, headers, config) {

              /*      $scope.List.push({
                        "customerId": obj.customerId + "1",
                        "clusterId": obj.clusterId+ "1",
                        "modelVersion": obj.modelVersion+ "1"

                });*/
//this is the part that I am filling the List (data provider)
                for (var i = 1; i < 65; i++) {
                    $scope.List.push({
                        "customerId": "customerId" + i,
                        "clusterId": "clusterId " + i,
                        "modelVersion": "modelVersion " + i
                    });


                }

            $scope.$apply;

        });
      //  });
        response.error(function(data, status, headers, config) {
            alert( "Exception details: " + JSON.stringify({data: data}));
        });



    }




});

＆＃13;

＆＃13;

＆＃13;

当我在最开始（我定义控制器的地方）初始化数据提供者时，该表有效，但是当我尝试动态填充数据提供者时，它不会刷新。我也使用了$ scope.apply但它没有用。 你能帮帮我吗？如何在更新数据提供程序后刷新表？