高效利用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 相关文章推荐
用JavaScript显示随机图像或引用
Apr 21 Javascript
一个选择最快的服务器转向代码
Apr 27 Javascript
jQuery Ajax使用 全解析
Dec 15 Javascript
Extjs3.0 checkboxGroup 动态添加item实现思路
Aug 14 Javascript
jQuery 滑动方法slideDown向下滑动元素
Jan 16 Javascript
jQuery+ajax实现鼠标单击修改内容的方法
Jun 27 Javascript
基于node实现websocket协议
Apr 25 Javascript
关于JSON与JSONP简单总结
Aug 16 Javascript
利用bootstrapValidator验证UEditor
Sep 14 Javascript
3种vue路由传参的基本模式
Feb 22 Javascript
详解Element 指令clickoutside源码分析
Feb 15 Javascript
uni-app自定义导航栏按钮|uniapp仿微信顶部导航条功能
Nov 12 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 柱状图实现代码
2009/12/04 PHP
Zend Framework入门教程之Zend_Db数据库操作详解
2016/12/08 PHP
记Laravel调用Gin接口调用formData上传文件的实现方法
2019/12/12 PHP
javascript window对象属性整理
2009/10/24 Javascript
事件绑定之小测试  onclick && addEventListener
2011/07/31 Javascript
JQuery 获取json数据$.getJSON方法的实例代码
2013/08/02 Javascript
js实现可折叠展开的手风琴菜单效果
2015/09/07 Javascript
JavaScript常用正则验证函数实例小结【年龄,数字,Email,手机,URL,日期等】
2017/01/23 Javascript
Angular在模板驱动表单中自定义校验器的方法
2017/08/09 Javascript
浅谈Angular路由复用策略
2017/10/04 Javascript
vue内置指令详解
2018/04/03 Javascript
JavaScript实现的滚动公告特效【基于jQuery】
2019/07/10 jQuery
node.JS的crypto加密模块使用方法详解(MD5,AES,Hmac,Diffie-Hellman加密)
2020/02/06 Javascript
微信小程序实现天气预报功能(附源码)
2020/12/10 Javascript
[58:54]EG vs RNG 2019国际邀请赛小组赛 BO2 第一场 8.16
2019/08/18 DOTA
[01:07:02]DOTA2-DPC中国联赛 正赛 iG vs PSG.LGD BO3 第三场 2月26日
2021/03/11 DOTA
用python登录Dr.com思路以及代码分享
2014/06/25 Python
在Python的Django框架中使用通用视图的方法
2015/07/21 Python
全面了解python字符串和字典
2016/07/07 Python
Python实现树莓派WiFi断线自动重连的实例代码
2017/03/16 Python
python 编码规范整理
2018/05/05 Python
利用Pandas读取文件路径或文件名称包含中文的csv文件方法
2018/07/04 Python
Python正则匹配判断手机号是否合法的方法
2020/12/09 Python
python实现趣味图片字符化
2019/04/30 Python
解决python3 requests headers参数不能有中文的问题
2019/08/21 Python
Python中函数的返回值示例浅析
2019/08/28 Python
python Dijkstra算法实现最短路径问题的方法
2019/09/19 Python
通过python-pptx模块操作ppt文件的方法
2020/12/26 Python
YSL圣罗兰美妆美国官网:Yves Saint Lauret US
2016/11/21 全球购物
一套PHP的笔试题
2013/05/31 面试题
留学自荐信的技巧
2013/10/17 职场文书
借款协议书
2014/04/12 职场文书
产品生产计划书
2014/05/07 职场文书
可可西里观后感
2015/06/08 职场文书
浅谈 JavaScript 沙箱Sandbox
2021/11/02 Javascript
python turtle绘图命令及案例
2021/11/23 Python