AngularJS——5、Http

最新推荐文章于 2020-01-16 13:23:08 发布

MF-Bee

最新推荐文章于 2020-01-16 13:23:08 发布

阅读量247

点赞数

分类专栏： AngularJS 文章标签： AngularJS

本文链接：https://blog.csdn.net/AFencounter/article/details/103557093

版权

AngularJS 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

$http.get(url) 读取服务器数据。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">  
        <script src="//apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>  
    </head>
    <body>
        <div ng-app="xxApp" ng-controller="xxCtrl"> 
            <ol>
                <li ng-repeat="x in names">
                    {{ x.Name + ', ' + x.City + ', ' + x.Country }}
                </li>
            </ol>
        </div>
        <script>
            var app = angular.module('xxApp', []);
            app.controller('xxCtrl', function($scope, $http) {
                $http.get("/xxJSON.php")
                     .success(function (response) {
                         //从服务端引入JSON数据，$scope.names变成一个数组
                         $scope.names = response.records;
                      });
            });
        </script>
    </body>
</html>

xxJSON.php

{"records":[
    {   
        "Name" : "YY",
        "City" : "Beijing",
        "Country" : "China"   
    },
    {
        "Name" : "FF",
        "City" : "Chengdu",
        "Country" : "China"
    },
    {
        "Name" : "LL",
        "City" : "Shanghai",
        "Country" : "China"
    }
]}

输出：

MF-Bee

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
AngularJS——5、Http

$http.get(url) 读取服务器数据。<!DOCTYPE html><html> <head> <meta charset="utf-8"> <script src="//apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js">&...
复制链接

扫一扫