Cấp bậc tác giả:

TRAINING

[Angular][Phần 6]AngularJS AJAX - $http

Được viết bởi webmaster ngày 17/04/2016 lúc 05:53 PM
$http là một đối tượng của AngularJS service dùng để lấy dữ liệu từ máy chủ bằng kỹ thuật AJAX.
  • 0
  • 6912

[Angular][Phần 6]AngularJS AJAX - $http

$http là một đối tượng của AngularJS service dùng để lấy dữ liệu từ máy chủ bằng kỹ thuật AJAX.

Ví dụ ta có tệp tin  HTML cung cấp dữ liệu như sau:

{
    "danhsach": [
        { ho: 'Tổng Thống Mỹ', ten: 'Barack Obama' },
                { ho: 'Phó Tổng thống Mỹ', ten: 'Joe Biden' },
                { ho: 'Chủ tịch nước Việt Nam', ten: 'Trần Đại Quang' },
                { ho: 'Thủ tướng nước Việt Nam', ten: 'Nguyễn Xuân Phúc' },
                { ho: 'Tổng thống Nga', ten: 'Vladimir Vladimirovich Putin' }
    ]
}

$http đọc dữ liệu trên bằng phương thức get với url cho trước.

   <div ng-app="myApp" ng-controller="danhsachCtrl"> 
        <ul>
            <li ng-repeat="x in danhsach">
                {{ x.ho + ' ' + x.ten }}
            </li>
        </ul>
    </div>
    <script>
        var app = angular.module('myApp', []);
        app.controller('danhsachCtrl', function ($scope, $http) {
            $http.get('/../Upload/DanhSach.htm')
            .success(function (response) {
                $scope.danhsach = response.danhsach;
            });
        });
    </script>


$http đọc dữ liệu từ /../Upload/DanhSach.htm

Nếu thành công, controller sẽ tạo thuộc tính danhsach trong biến $scope trong hàm success, bạn cũng có thể xử lý lỗi trong hàm error như sau:

 $http.get('/../Upload/DanhSach.htm')
                .success(function (response) {
                    $scope.danhsach = response.danhsach;
                })
    .error(function(response) {
            // To do.
});

Nguồn bài viết: Sưu tầm

BÌNH LUẬN BÀI VIẾT

Bài viết mới nhất

LIKE BOX

Bài viết được xem nhiều nhất

HỌC HTML