zoukankan      html  css  js  c++  java
  • AngularJS Http

    1.  $http 是 AngularJS 中的一个核心服务,用于读取远程服务器的数据。

    2.  使用$http获取json文件的数据,这里遇到了一个超级大坑,不知道是什么原因,以前代码写好后没有效果,然后使用浏览器调试的时候报错,说success不是一个方法,然后我就十分纳闷,觉得很不现实,感觉不会报这样的错,于是在网上找答案,找了半天没有找到,然后我就试着引用了网上面的AngularJS库,发现可以正常显示,我发现往上面的AngularJS库的版本跟我的不一样,我是最新的1.6版本的,然后我又一次的在网上搜索,发现别人也有这样的问题,于是我就知道了这个原因是AngularJS库的问题,不是我代码写得有问题,所以大家要是跟我写一样的代码的话,最好还是不要只用1.6版本的AngularJS库。

    {
        "sites": [
            {
                "Name": "菜鸟教程",
                "Url": "www.runoob.com",
                "Country": "CN"
            },
            {
                "Name": "Google",
                "Url": "www.google.com",
                "Country": "USA"
            },
            {
                "Name": "Facebook",
                "Url": "www.facebook.com",
                "Country": "USA"
            },
            {
                "Name": "微博",
                "Url": "www.weibo.com",
                "Country": "CN"
            }
        ]
    }
    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title></title>
            <script type="text/javascript" src="js/angular-1.3.15.min.js"></script>
        </head>
        <body>
            <div ng-app="myApp" ng-controller="myCtrl"><!--AngularJS应用程序由ng-app定义,在这个div内运行-->
                <ul>
                    <li ng-repeat="x in names">
                        {{x.Name + ", " +x.Country}}
                    </li>
                </ul>
            </div>
        
            <script>
                var app = angular.module("myApp", []);
                app.controller('myCtrl', function($scope,$http) { /*myCtrl是一个JavaScript函数*/
                    $http({
                        url:'file/sites.json',
                        method:'GET',
                        dataType:'json'
                    }).success(function(data){
                        $scope.names = data.sites;
                    }).error(function(){
                        alert('请就失败!');
                    });
                });
            </script>
        </body>
    </html>

  • 相关阅读:
    Django入门
    Python从入门到放弃
    Python中的元类(metaclass)
    蓝鲸gse启动失败
    VS2019添加微软ReportViewer
    DevExpress WinForms各版本与 .NET、Visual Studio 的版本兼容性
    SQL语句查询每个分组的前N条记录的实现方法
    如何查看Windows安装版本号
    学习webpack
    Python3.x将代码打包成exe程序并添加图标
  • 原文地址:https://www.cnblogs.com/wgl1995/p/6265209.html
Copyright © 2011-2022 走看看