在Angular中動態填充表格

Question

我是Angular的新手。我創建了一個應用程序，只要點擊一個按鈕，應該會觸發一個調用，它會獲取一組json對象並填充特定的表。在下面的控制器代碼中，我設法直接填充表格，而不需要單擊按鈕（通過this.tableParams），但我想要的是觸發此數據獲取過程並僅在populateTable（）函數爲叫。我該怎麼做？

(function() { 
'use strict'; 

angular 
    .module('anomalies') 
    .controller('controller', ['$log', '$scope', '$http', 'NgTableParams', function ($log, $scope, $http, NgTableParams) { 

     $scope.populateTable = function() { 

      // 

     } 


     this.tableParams = new NgTableParams({}, { 
      filterDelay: 300, 
      getData: function (params) { 
       return $http({ 
        method: 'GET', 
        url: '/server/data.json' 
       }).then(function (response) { 
        return response.data; 
       }, function (response) { 
        $log.log(response); 
        return []; 
       }); 
      } 
     }); 

    }]); 

})(); 

Answer 1

爲什麼不創建populateTable - 函數裏面的NgTableParams -object？

angular 
    .module('anomalies') 
    .controller('controller', ['$log', '$scope', '$http', 'NgTableParams', function ($log, $scope, $http, NgTableParams) { 

    $scope.populateTable = function() { 
     this.tableParams = new NgTableParams({}, { 
     filterDelay: 300, 
     getData: function (params) { 
      return $http({ 
       method: 'GET', 
       url: '/server/data.json' 
      }).then(function (response) { 
       return response.data; 
      }, function (response) { 
       $log.log(response); 
       return []; 
      }); 
     } 
     }); 
    }.bind(this); 




}]); 

不是.bind(this)。這確保this關鍵字在populateTable中的含義與在控制器中的功能相同。

Answer 2

將this.tableParams移入$scope.populateTable函數。將該功能綁定到視圖中的按鈕，例如<button ng-click="populateTable()">Click Me!</button>