Impossible de lier à ngTable à partir de l'ensemble de données

Question

Donc, dans Angular, j'essaye de lier un ng-Table à un ensemble de données mais ne semble pas fonctionner avec mes données de réponse. Je pense que mon problème se situe quelque part ici, "" - self.tableParams = new NgTableParams ({}, {dataset: 'data'}); - "" mais je ne suis pas sûr. En outre, je ne reçois aucune console d'erreurs. Quelqu'un peut-il jeter un peu de lumière, merci.

Controller:

UtilityApp.controller('u_CompaniesController', function ($scope, $http, NgTableParams) { 

$scope.message = "Companies"; 
$scope.myData = []; 
$http({ 
    method: 'GET', 
    url: '/Utility/GetCompanies', 
}).then(function successCallback(response) { 
    var self = this; 
    var data = response.data; 
    self.tableParams = new NgTableParams({}, { dataset: 'data' }); 

}, function errorCallback(response) { 
    alert("error"); 
});  

});

Ng-Table

<div ng-controller="u_CompaniesController"> 
    <table id="tblCompanies" ng-table="vm.tableParams" class="table" show-filter="true"> 
     <tr ng-repeat="c in $tableParams"> 
      <td title="'CompanyCd'" filter="{ CompanyCd: 'text'}" sortable="'CompanyCd'"> 
       {{c.CompanyCd}} 
      </td> 
      <td title="'CompanyName'" filter="{ CompanyName: 'text'}" sortable="'CompanyName'"> 
       {{c.CompanyName}} 
      </td> 
     </tr> 
    </table> 
</div> 

Answer 1

Essayez de déplacer var self = this à droite dans la déclaration du contrôleur. Vous devriez également mettre à jour votre code HTML par ng-controller="u_CompaniesController as vm". Lire this blogpost Pour plus d'informations sur le contrôleur en tant que syntaxe.

Ou simplement utiliser $scope, je le recommande si vous commencez simplement avec angulaire. Dans ce cas, retirer la vm de votre html ng-table="tableParams"

$scope.tableParams = new NgTableParams({}, { dataset: 'data' }); 

Contrôleur

UtilityApp.controller('u_CompaniesController', function ($scope, $http, NgTableParams) { 

$scope.message = "Companies"; 
$scope.myData = []; 
$http({ 
    method: 'GET', 
    url: '/Utility/GetCompanies', 
}).then(function successCallback(response) { 

    var data = response.data; 
    $scope.tableParams = new NgTableParams({}, { dataset: 'data' }); 

}, function errorCallback(response) { 
    alert("error"); 
});  

HTML

<div ng-controller="u_CompaniesController"> 
    <table id="tblCompanies" ng-table="tableParams" class="table" show-filter="true"> 
     <tr ng-repeat="c in $tableParams"> 
      <td title="'CompanyCd'" filter="{ CompanyCd: 'text'}" sortable="'CompanyCd'"> 
       {{c.CompanyCd}} 
      </td> 
      <td title="'CompanyName'" filter="{ CompanyName: 'text'}" sortable="'CompanyName'"> 
       {{c.CompanyName}} 
      </td> 
     </tr> 
    </table> 
</div>