高效利用Angular中内置服务$http、$location等


Posted in Javascript onMarch 22, 2016

AngularJS中为我们提供了众多的内置服务,通过这些内置服务可以轻松的实现一些常用功能。下面对Angular中常用的内置服务进行一下总结。
1.$location服务

$location服务用于返回当前页面的URL地址,示例代码如下:
var app = angular.module('myApp', []); 
app.controller('customersCtrl', function($scope, $location) { 
 $scope.myUrl = $location.absUrl(); 
});

 这里为$scope对象定义了myUrl变量,然后利用$location服务读取到了URL地址并存储到myUrl中。
2..$http服务
$http 是 AngularJS 中最常用的服务,它经常用于服务器的数据传输。下面的例子中服务向服务器发送请求,应用响应服务器传送过来的数据。

var app = angular.module('myApp', []); 
app.controller('myCtrl', function($scope, $http) { 
 $http.get("welcome.htm").then(function (response) { 
  $scope.myWelcome = response.data; 
 }); 
});

3.$timeout()服务和$interval()服务
这两个服务的功能对应的是javascript中的setTimeout()和setTimeInterval函数。一个简单的实时更新时间例子如下:

app.controller('myCtrl', function($scope, $interval) { 
 $scope.theTime = new Date().toLocaleTimeString(); 
 $interval(function () { 
  $scope.theTime = new Date().toLocaleTimeString(); 
 }, 1000); 
});

 除了Angular中提供的内置服务外,我们也可以自己定义服务,利用service即可,下面是一个定义服务的基本代码框架:

app.service('hexafy', function() { 
 this.myFunc = function (x) { 
  return x.toString(16); 
 } 
});

定义好服务后,我们可以像使用内置的Angular服务一样使用它:

app.controller('myCtrl', function($scope, hexafy) { 
 $scope.hex = hexafy.myFunc(255); 
});

以上就是针对Angular中常用的内置服务进行的汇总,希望对大家的学习有所帮助。

Javascript 相关文章推荐
js 实现菜单上下显示附效果图
Nov 21 Javascript
带左右箭头图片轮播的JS代码
Dec 18 Javascript
Javascript验证上传图片大小[前台处理]
Jul 18 Javascript
JQuery控制Radio选中方法分析
May 29 Javascript
jQuery实现弹出窗口弹出div层的实例代码
Jan 09 Javascript
angular中的http拦截器Interceptors的实现
Feb 21 Javascript
js canvas实现放大镜查看图片功能
Jun 08 Javascript
详解vue项目构建与实战
Jun 27 Javascript
js 判断一个数字是不是2的n次方幂的实例
Nov 26 Javascript
详解使用vue-admin-template的优化历程
May 20 Javascript
vue-awesome-swiper 基于vue实现h5滑动翻页效果【推荐】
Nov 08 Javascript
JS中使用new Option()实现时间联动效果
Dec 10 Javascript
BootStrap实用代码片段之一
Mar 22 #Javascript
Javascript中的几种继承方式对比分析
Mar 22 #Javascript
JS函数定义方式的区别介绍
Mar 22 #Javascript
基于javascript制作经典传统的拼图游戏
Mar 22 #Javascript
javascript函数命名的三种方式及区别介绍
Mar 22 #Javascript
javascript仿京东导航左侧分类导航下拉菜单效果
Nov 25 #Javascript
JS中多种方式创建对象详解
Mar 22 #Javascript
You might like
php 字符串函数收集
2010/03/29 PHP
php带抄送和密件抄送的邮件发送方法
2015/03/20 PHP
PHP中判断文件存在使用is_file还是file_exists?
2015/04/03 PHP
老版本PHP转义Json里的特殊字符的函数
2015/06/08 PHP
四个PHP非常实用的功能
2015/09/29 PHP
PHP实现git部署的方法教程
2017/12/19 PHP
QQ邮箱的一个文本编辑器代码
2007/03/14 Javascript
jQuery的三种$()
2009/12/30 Javascript
ExtJS 设置级联菜单的默认值
2010/06/13 Javascript
JS弹出层的显示与隐藏示例代码
2013/12/27 Javascript
引用外部脚本时script标签关闭的写法
2014/01/20 Javascript
jQuery原理系列-css选择器的简单实现
2016/06/07 Javascript
JS基于递归实现倒计时效果的方法
2016/11/26 Javascript
Javascript中八种遍历方法的执行速度深度对比
2017/04/25 Javascript
关于vue.js v-bind 的一些理解和思考
2017/06/06 Javascript
jQuery选择器之子元素选择器详解
2017/09/18 jQuery
详解基于vue-cli优化的webpack配置
2017/11/06 Javascript
node.js监听文件变化的实现方法
2019/04/17 Javascript
Vue源码解析之数据响应系统的使用
2019/04/24 Javascript
Js通过AES加密后PHP用Openssl解密的方法
2019/07/12 Javascript
使用Phantomjs和Node完成网页的截屏快照的方法
2019/07/16 Javascript
js轮播图之旋转木马效果
2020/10/13 Javascript
jQuery实现可以扩展的日历
2020/12/01 jQuery
[01:25]2015国际邀请赛最佳短片奖——斧王《拆塔英雄:天赋异禀》
2015/09/22 DOTA
实例解析Python中的__new__特殊方法
2016/06/02 Python
浅谈Python采集网页时正则表达式匹配换行符的问题
2018/12/20 Python
python的turtle库使用详解
2019/05/10 Python
对python3 Serial 串口助手的接收读取数据方法详解
2019/06/12 Python
使用Keras实现Tensor的相乘和相加代码
2020/06/18 Python
Python调用高德API实现批量地址转经纬度并写入表格的功能
2021/01/12 Python
LN-CC日本:高端男装和女装的奢侈时尚目的地
2019/09/01 全球购物
荷兰家电销售网站:Welhof
2020/12/08 全球购物
幼儿园优秀教师事迹
2014/02/13 职场文书
初中家长寄语
2014/04/02 职场文书
资产移交协议书
2016/03/24 职场文书
基于PyTorch实现一个简单的CNN图像分类器
2021/05/29 Python