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

2.读取JSON文件:

**JSON文件如下:

{

"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"}

]

}

**$http.get(url)是用于读取服务器数据的函数;

<div ng-app="myApp" ng-controller="siteCtrl" >

<ul>

  <li ng-repeat="x in names">

  {{x.Name+' ,'+x.Country}}

  </li>

</ul>

</div>

<script>

var app=angular.module('myApp',[]);

app.controller('siteCtrl',function($scope,$http){

$http.get("http://www.runoob.com/try/angularjs/data/sites.php").success(function(response){$scope.names=response.sites;});

});

</script>

**以上代码的get请求是本站的服务器;

**AngularJS应用通过ng-app定义,应用于<div>中执行;

**ng-controller指令设置了controller对象名;

**函数customerController是一个标准的javaScript对象构造器;

**控制器对象有一个属性:$scope.names;

**$http.get()从web服务器上读取静态JSON数据;

**服务器文件为:http://www.runoob.com/try/angularjs/data/sites.php;

**当服务端载入JSON数据时,$scope.names变为一个数组;

Angular JS 学习之Http的更多相关文章

  1. 适合我胃口的angular.js学习资料

    断断续续弄了半年的ANGULAR.JS学习资料,网上下载了N多资料,测试了很多次. 现在只能算是入门,因时间问题,现在要转入其它领域. 如果以后要拾起来,下面这个PDF比较对我胃口. <Angu ...

  2. python , angular js 学习记录【1】

    1.日期格式化 Letter Date or Time Component Presentation Examples G Era designator Text AD y Year Year 199 ...

  3. angular.js学习的第一天

    第一天对angular.js进行学习,肯定是面对的入门的最简单的实例: 实现下面的这个效果,首先需要在html页面引入angular.js,在下面的div中,ng-app则表示在当前div是一个ang ...

  4. Angular JS 学习之路由

    1.AngularJS路由允许我们通过不同的URL访问不同的内容:通过AngularJS可以实现多视图的单页WEB访问(SPA) 2.通常我们的URL形式为http://runoob.com/firs ...

  5. Angular JS 学习之Bootstrap

    1.要使用Bootstrap框架,必须在<head>中加入链接: <link rel="stylesheet" href="//maxcdn.boots ...

  6. Angular JS学习之指令

    1.Angular JS通过称为指令的新属性来扩展HTML:通过内置的指令来为应用添加功能: 2.AngularJS指令:AngularJS指令是扩展的HTML属性,带有前缀ng-: **ng-app ...

  7. Angular JS学习之表达式

    1.Angular JS使用表达式把数据绑定到HTML: 2.Angular JS表达式写在双大括号中:{{expression}} **Angular JS表达式把数据绑定到HTML,这与ng-bi ...

  8. Angular JS 学习之简介

    1.Angular JS是一个JavaScript框架,它是一个以JavaScript编写的库,它可以通过<script>标签添加到HTML页面: <script src=" ...

  9. Angular JS 学习笔记(自定义服务:factory,Promise 模式异步请求查询:$http,过滤器用法filter,指令:directive)

    刚学没多久,作了一个小项目APP,微信企业号开发与微信服务号的开发,使用的是AngularJS开发,目前项目1.0版本已经完结,但是项目纯粹为了赶工,并没有发挥AngularJS的最大作用,这几天项目 ...

  10. Angular.js 学习笔记

    AngularJS 通过新的属性和表达式扩展了 HTML. AngularJS 可以构建一个单一页面应用程序. <!-- ng-app 指令定义一个 AngularJS 应用程序. ng-mod ...

随机推荐

  1. 使用bower管理前端依赖

    bower,类似于npm.maven等后端管理构建工具一样,bower可以用来管理前端浏览器依赖,关于bower详细介绍参考官网:https://bower.io/ bower init命令:初始化项 ...

  2. angular-xeditable

    http://vitalets.github.io/angular-xeditable/#text-simple ng-repeat="user in users" e-rows= ...

  3. Unity3D ShaderLab 语法:Properties

    本篇内容主要介绍Unity ShaderLab 语法:Properties Unity中的整个场景效果的表现,Shader起了至关重要的作用,为了方便我们的学习,unity采用了cg作为着色器语言. ...

  4. 让边框和文本一样高,不受line-height影响,可以使用padding,padding可以用于行内元素

    如果设置了,display:inline-block;边框大小至少和行高一样.这样就可能比文字高.

  5. [转]adb pull Permission denied及no such file错误

    adb pull  Permission denied及no such file错误 http://www.the8m.com/blog/article/javadk/adbpull.html XP系 ...

  6. Dynamices CRM JS 类库 神器 XrmServiceToolkit - A Microsoft Dynamics CRM 2011 &amp; CRM 2013 JavaScript Library

    XrmServiceToolkit - A Microsoft Dynamics CRM 2011 & CRM 2013 JavaScript Library http://xrmservic ...

  7. C#方法的使用

    static void Main(string[] arr) { , ); Console.WriteLine(max); Console.ReadKey(); } /// <summary&g ...

  8. [半原创]指纹识别+谷歌图片识别技术之C++代码

    原地址:http://blog.csdn.net/guoming0000/article/details/8138223 以前看到一个http://topic.csdn.net/u/20120417/ ...

  9. Contains Duplicate leetcode

    Given an array of integers, find if the array contains any duplicates. Your function should return t ...

  10. hadoop job解决大数据量关联时数据倾斜的一种办法

    转自:http://www.cnblogs.com/xuxm2007/archive/2011/09/01/2161929.html http://www.geminikwok.com/2011/04 ...