Angular JS 学习之Http
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的更多相关文章
- 适合我胃口的angular.js学习资料
断断续续弄了半年的ANGULAR.JS学习资料,网上下载了N多资料,测试了很多次. 现在只能算是入门,因时间问题,现在要转入其它领域. 如果以后要拾起来,下面这个PDF比较对我胃口. <Angu ...
- python , angular js 学习记录【1】
1.日期格式化 Letter Date or Time Component Presentation Examples G Era designator Text AD y Year Year 199 ...
- angular.js学习的第一天
第一天对angular.js进行学习,肯定是面对的入门的最简单的实例: 实现下面的这个效果,首先需要在html页面引入angular.js,在下面的div中,ng-app则表示在当前div是一个ang ...
- Angular JS 学习之路由
1.AngularJS路由允许我们通过不同的URL访问不同的内容:通过AngularJS可以实现多视图的单页WEB访问(SPA) 2.通常我们的URL形式为http://runoob.com/firs ...
- Angular JS 学习之Bootstrap
1.要使用Bootstrap框架,必须在<head>中加入链接: <link rel="stylesheet" href="//maxcdn.boots ...
- Angular JS学习之指令
1.Angular JS通过称为指令的新属性来扩展HTML:通过内置的指令来为应用添加功能: 2.AngularJS指令:AngularJS指令是扩展的HTML属性,带有前缀ng-: **ng-app ...
- Angular JS学习之表达式
1.Angular JS使用表达式把数据绑定到HTML: 2.Angular JS表达式写在双大括号中:{{expression}} **Angular JS表达式把数据绑定到HTML,这与ng-bi ...
- Angular JS 学习之简介
1.Angular JS是一个JavaScript框架,它是一个以JavaScript编写的库,它可以通过<script>标签添加到HTML页面: <script src=" ...
- Angular JS 学习笔记(自定义服务：factory，Promise 模式异步请求查询:$http,过滤器用法filter，指令:directive)
刚学没多久,作了一个小项目APP,微信企业号开发与微信服务号的开发,使用的是AngularJS开发,目前项目1.0版本已经完结,但是项目纯粹为了赶工,并没有发挥AngularJS的最大作用,这几天项目 ...
- Angular.js 学习笔记
AngularJS 通过新的属性和表达式扩展了 HTML. AngularJS 可以构建一个单一页面应用程序. <!-- ng-app 指令定义一个 AngularJS 应用程序. ng-mod ...
随机推荐
- 使用bower管理前端依赖
bower,类似于npm.maven等后端管理构建工具一样,bower可以用来管理前端浏览器依赖,关于bower详细介绍参考官网:https://bower.io/ bower init命令:初始化项 ...
- angular-xeditable
http://vitalets.github.io/angular-xeditable/#text-simple ng-repeat="user in users" e-rows= ...
- Unity3D ShaderLab 语法：Properties
本篇内容主要介绍Unity ShaderLab 语法:Properties Unity中的整个场景效果的表现,Shader起了至关重要的作用,为了方便我们的学习,unity采用了cg作为着色器语言. ...
- 让边框和文本一样高，不受line-height影响，可以使用padding，padding可以用于行内元素
如果设置了,display:inline-block;边框大小至少和行高一样.这样就可能比文字高.
- [转]adb pull Permission denied及no such file错误
adb pull Permission denied及no such file错误 http://www.the8m.com/blog/article/javadk/adbpull.html XP系 ...
- Dynamices CRM JS 类库 神器 XrmServiceToolkit - A Microsoft Dynamics CRM 2011 & CRM 2013 JavaScript Library
XrmServiceToolkit - A Microsoft Dynamics CRM 2011 & CRM 2013 JavaScript Library http://xrmservic ...
- C#方法的使用
static void Main(string[] arr) { , ); Console.WriteLine(max); Console.ReadKey(); } /// <summary&g ...
- [半原创]指纹识别+谷歌图片识别技术之C++代码
原地址:http://blog.csdn.net/guoming0000/article/details/8138223 以前看到一个http://topic.csdn.net/u/20120417/ ...
- Contains Duplicate leetcode
Given an array of integers, find if the array contains any duplicates. Your function should return t ...
- hadoop job解决大数据量关联时数据倾斜的一种办法
转自:http://www.cnblogs.com/xuxm2007/archive/2011/09/01/2161929.html http://www.geminikwok.com/2011/04 ...