angularjs之$ajax请求
AngularJS不仅仅只有双向绑定等等功能，还有发送Ajax请求的Api。
效果图：
请求的文件（data.php）：
<?php
$data = [
'股市下跌',
'清明小长假结束',
'我要接着学习了'
];
echo json_encode($data);Jqurey方式
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>使用jquery加载网络数据</title>
</head>
<script src="http://cdn.bootcss.com/jquery/3.2.0/jquery.min.js"></script>
<body>
<h1>使用jquery加载网络数据</h1>
<ul>
<li></li>
<li></li>
<li></li>
</ul>
</body>
<script>
$.get('data.php',function(rs){
var i = 0;
$('li').each(function(){
this.innerHTML = rs[i++];
});
},'json');
</script>
</html>AngularJS方式
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>使用Angular加载网络数据</title>
</head>
<script src="//cdn.bootcss.com/angular.js/1.6.3/angular.min.js"></script>
<body>
<h1>使用Angular加载网络数据</h1>
<ul ng-app="news" ng-controller="con">
<li ng-repeat="n in news">{{n}}</li>
</ul>
</body>
<script>
var app = angular.module('news',[]);
app.controller('con',function($scope,$http){
$http({
method:'GET',
url:'data.php',
}).then(function successCallback (rs){
$scope.news = rs.data;
});
});
</script>
</html>使用JQuery中的Ajax和使用AngularJS中的Ajax本质上没有区别，只是api的区别，但是获取数据之后，jquery方式必须自己写操作dom元素的代码，但是AngularJS中就不用手动写操作dom元素的代码，而只是用一个ng-repeat标签来操作dom，换句话说，AngularJS操作dom的代码已经被封装起来了，我们不用写，而jquery中必须写。
angularjs之$ajax请求的更多相关文章
- angularjs 发送ajax请求的问题
在angularjs中使用 ajax 如果使用 jquery的 ajax发送请求会遇到结果返回了,但是页面的值却没有改变,如: $scope.queryNameMatch = function() { ...
- 关于angularjs中ajax请求php接口参数个是转换的问题
mainApp.config(function($httpProvider){ $httpProvider.defaults.transformRequest = function(obj){ var ...
- angularjs中ajax请求时传递参数的方法
method1方法使用的是params参数,该用法会把参数直接附加到url中 method2方法使用的是data参数,该参数会把页面参数类型从默认的multipart/form-data改为appli ...
- 如何使用angularjs实现ajax异步请求
Sample.html <!DOCTYPE html> <html ng-app="myApp"> <head> <title>fo ...
- js 中ajax请求时设置 http请求头中的x-requestd-with= ajax
今天发现 AngularJS 框架的$http服务提供的$http.get() /$http.post()的ajax请求中没有带 x-requested-with字段. 这样的话,后端的php 就无法 ...
- 一步步学习javascript基础篇（9）：ajax请求的回退
需求1: ajax异步请求 url标识请求参数(也就是说复制url在新页面打开也会是ajax后的效果) ajax异步请求没问题,问题一般出在刷新url后请求的数据没了,这就是因为url没有记录参数.如 ...
- 配置Chrome支持本地（file协议）的AJAX请求
什么问题 WEB开发过程中,很多时候我们都是写一些简单的Demo,并不是开发一个完整项目,此时我们常见的操作是: 新建文件夹 新建需要的文件 在Sublime(或其他编辑器)中完成DEMO的编码 双击 ...
- JQuery使用deferreds串行多个ajax请求
使用JQuery对多个ajax请求串行执行. HTML代码: <a href="#">Click me!</a> <div></div&g ...
- ajax请求成功后打开新开窗口(window.open())被拦截的解决方法
问题:今天在做项目时需要在ajax请求成功后打开一个新的窗口,此时遇到浏览拦截了新窗口的问题,尝试在ajax 回调函数中模拟执行 click 或者 submit 等用户行为(trigger('clic ...
随机推荐
- Java实现时钟小程序【代码】
哎,好久没上博客园发东西了,上一次还是两个月前的五一写的一篇计算器博客,不过意外的是那个程序成了这学期的Java大作业,所以后来稍微改了一下那个程序就交了上去,这还是美滋滋.然后五月中旬的时候写了一个 ...
- c#只读字段和常量的区别，以及静态构造函数的使用 .
using System;using System.Collections.Generic;using System.Linq;using System.Text; namespace Console ...
- Android数据库升级不丢失数据解决方案
在Android开发中,sqlite至关重要,增删查改不多说,难点在于,1,并发,多个线程同时操作数据库.2,版本升级时,如果数据库表中新加了个字段,如何在不删除表的情况下顺利过渡,从而不丢失数据. ...
- AutoFac IoC DI 依赖注入
AutoFac IoC DI 依赖注入 记录点点滴滴知识,为了更好的服务后来者! 一.为什么使用AutoFac? 之前介绍了Unity和Ninject两个IOC容器,但是发现园子里用AutoFac的貌 ...
- bzoj1077
题解 这道题n的范围很小,所以我们可以考虑枚举+判定 设放在天平右边的是C,D. 以A+B<C+D为例,因为差分约束必须是差的形式,所以我们将式子变形 B−C<D−A然后枚举D,A的取值, ...
- js设计模式中发布与订阅实现观察者模式例子
<script> var pubsub = {}; (function(q) { var topics = {}; subuid = -1; q.publish = function(to ...
- 动态更新ViewPager中的Fragment（替换Fragment）
1.最近做需求,遇到一个问题,一个Fragment中包含了一个ViewPager,viewPager中包含一adapter ,adapter中包含了4个Fragment.想要动态替换第3个Fragme ...
- java基础---->Zip压缩的使用
java中提供了对压缩格式的数据流的读写.它们封装到现成的IO 类中,以提供压缩功能.下面我们开始java中压缩文件的使用. 目录导航: 关于压缩的简要说明 GZIP压缩文件的使用 ZIP压缩文件的使 ...
- java基础第8天
继承extends(也叫扩展) 多个类中存在相同的属性和行为时,将这些内容抽取到单独一个类中,那么多个类无需再定义这些属性和行为,只要继承那个类即可. 通过extends关键字可以实现类的继承 继承的 ...
- STL标准库-容器-unordered_set
技术在于交流.沟通,本文为博主原创文章转载请注明出处并保持作品的完整性 unordered_set与与unordered_map相似,这次主要介绍unordered_set unordered_set ...