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 ...
随机推荐
- codeforces 500A. New Year Transportation
题目链接:http://codeforces.com/problemset/problem/500/A 题目意思:给出 n-1 个 cell,每个 cell 有一个值 ai,表示在这个编号为 i 的 ...
- 51 NOD 1384 全排列(STL 搜索)
1384 全排列 基准时间限制:1 秒 空间限制:131072 KB 分值: 0 难度:基础题 收藏 关注 给出一个字符串S(可能又重复的字符),按照字典序 ...
- 深入浅出JMS(一)——JMS简介
如果手机只能进行实时通话,没有留言和短信功能会怎么样?一个电话打过来,正好没有来得及接上,那么这个电话要传递的信息肯定就收不到了.为什么不能先将信息存下来,当用户需要查看信息的时候再去获得信息呢?伴随 ...
- CSS3实现圆角效果
利用border-radius属性可以给元素div,input元素等添加圆角效果 后跟 值为这个圆角的半径,即数值越大效果越明显 -webkit-border-top/bottom-left/righ ...
- 【python】类中的self
在python的类中,经常会写self,代表对象自己.如下例: #coding=utf-8 class Foo: def __init__(self, name): self.name = name ...
- 分模块的maven项目调试时报Source not found的解决办法
一.背景 通常在开发中,我们经常会拆分我们的项目为一个个maven子工程,然后用一个父项目进行集成,并且子项目还会继承自父项目.当我们对这些项目进行debug调试的时候往往会在eclipse中出现so ...
- Android Hybrid开发
参考:谈谈Android App混合开发 Html 5和Native的交互 WebView 本来就支持js和Java相互调用,你只需要开启 WebView 的JavaScript脚本执行, 然后通过代 ...
- Java观察者模式(Observer模式)
Java深入到一定程度,就不可避免的碰到设计模式(design pattern)这一概念,了解设计模式,将使自己对java中的接口或抽象类应用有更深的理解.设计模式在java的中型系统中应用广泛,遵循 ...
- mysql扩展库-1
启用mysql扩展库 在php.ini文件中去配置mysql扩展库 extension=php_mysql.dll 可以通过 phpinfo() 查看当前php支持什么扩展库. 在sql扩展库中创建一 ...
- AIX性能监控
http://www.ibm.com/developerworks/cn/aix/library/au-aix7memoryoptimize2/ http://www.aixchina.net/Art ...