Lấy dữ liệu json hiển thị ra lưới

• Sơ đồ tổng quan angular
• Vòng lặp trong vòng lặp

* Nạp head:
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
* Nạp đơn giản:

<div class="card mb-3" ng-app="myApp"  ng-controller="myCtrl">
<p ng-repeat="x in datas">{{ x.Name }}</p>
</div>
<script>
var app = angular.module("myApp", []);
app.controller('myCtrl', function($scope, $http) {

  $http({
    method : "GET",
    url : "FILE_GET_JSON.ASPX"
  }).then(function mySuccess(response) { 
      $scope.datas = response.data; // response.data (cố định), nếu có nhiều table thì response.data.TenTable
    }, function myError(response) {
      alert( response.statusText );
  });

});
</script>

* Chú ý: nếu json trả về nhiều table cùng 1 lúc thì     
       $scope.datas = response.data.Table1;     với Table1 là tên table trong DataSet
   * Chú ý: dữ liệu trên JSON hiển thị ra để thay thể lại Table1


* Nạp có nút nạp lại:

<div class="card mb-3" ng-app="myApp"  ng-controller="myCtrl">
<p ng-repeat="x in datas">
 {{ x.Name }}   
</p>
</div>

<script>
var app = angular.module("myApp", []);
app.controller('myCtrl', function($scope, $http){

    $scope.loadData = function () {
    $http({
            method : "GET",
            url : "ManagerFile_xml_struct.aspx?file=<iif-D>Url:file</iif-D>&type=json"
        }).then(function mySuccess(response)
        {
            $scope.datas = response.data;
        }, function myError(response)
            {
            alert( response.statusText );
            }
            );
  } 
  $scope.loadData();   
});
</script>

** Viết gọn:
<script>
var app = angular.module("myApp", []);
app.controller('myCtrl', function($scope, $http){

    $scope.loadData = function () {
       alert('code');    
    } 
  $scope.loadData();   
});
</script>

** Tính tổng

 $scope.TongTienPhaiTra =0;
             response.data.Table.forEach(function(data, index) {
                       $scope.TongTienPhaiTra += data.TenCot
            });

 

*  Một số lỗi hay gặp:
1. Dư thẻ div (chứa 2 cái trở lên)
<div ng-app="myApp"  ng-controller="myCtrl">