高效利用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 相关文章推荐
基于jquery的一个浮动框(扩展性比较好 )
Aug 27 Javascript
JQuery+DIV自定义滚动条样式的具体实现
Jun 25 Javascript
Google 地图叠加层实例讲解
Aug 06 Javascript
JS+HTML5实现的前端购物车功能插件实例【附demo源码下载】
Oct 17 Javascript
详解Angular的内置过滤器和自定义过滤器【推荐】
Dec 26 Javascript
从零开始学习Node.js系列教程一:http get和post用法分析
Apr 13 Javascript
集成vue到jquery/bootstrap项目的方法
Feb 10 jQuery
jQuery使用bind动态绑定事件无效的处理方法
Dec 11 jQuery
详解vue-cli3开发Chrome插件实践
May 29 Javascript
详解nuxt 微信公众号支付遇到的问题与解决
Aug 26 Javascript
JS实现网站吸顶条
Jan 08 Javascript
javascript中可能用得到的全部的排序算法
Mar 05 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.MVC的模板标签系统(一)
2006/09/05 PHP
php把session写入数据库示例
2014/02/26 PHP
ThinkPHP CURD方法之table方法详解
2014/06/18 PHP
php使用curl简单抓取远程url的方法
2015/03/13 PHP
php获得网站访问统计信息类Compete API用法实例
2015/04/02 PHP
php基于Snoopy解析网页html的方法
2015/07/09 PHP
YII2自动登录Cookie总是失效的解决方法
2017/06/28 PHP
php实现网页端验证码功能
2017/07/11 PHP
PHP chop()函数讲解
2019/02/11 PHP
laravel框架创建授权策略实例分析
2019/11/22 PHP
关于Jqzoom的使用心得 jquery放大镜效果插件
2010/04/12 Javascript
js解析与序列化json数据(一)json.stringify()的基本用法
2013/02/01 Javascript
jQuery操作表格(table)的常用方法、技巧汇总
2014/04/12 Javascript
jquery实现的鼠标拖动排序Li或Table
2014/05/04 Javascript
HTML的select控件美化
2017/03/27 Javascript
node.js调用Chrome浏览器打开链接地址的方法
2017/05/17 Javascript
JavaScript实现一个空中避难的小游戏
2017/06/06 Javascript
JavaScript实现图片拖曳效果
2017/09/08 Javascript
浏览器调试动态js脚本的方法(图解)
2018/01/19 Javascript
JavaScript常用数组操作方法,包含ES6方法
2020/05/10 Javascript
微信小程序合法域名配置方法
2019/05/06 Javascript
js实现踩五彩块游戏
2020/02/08 Javascript
js实现tab栏切换效果
2020/08/02 Javascript
nuxt 实现在其它js文件中使用store的方式
2020/11/05 Javascript
Python3 伪装浏览器的方法示例
2017/11/23 Python
Python+selenium点击网页上指定坐标的实例
2019/07/05 Python
python 模拟创建seafile 目录操作示例
2019/09/26 Python
python列表推导式操作解析
2019/11/26 Python
python实现PCA降维的示例详解
2020/02/24 Python
Python Celery异步任务队列使用方法解析
2020/08/10 Python
Cotton On南非:澳洲时尚平价品牌
2018/06/28 全球购物
转让协议书范本
2014/04/15 职场文书
白血病募捐倡议书
2014/05/14 职场文书
职业道德模范事迹材料
2014/08/24 职场文书
远程教育集中轮训基层干部培训班学习心得体会
2016/01/09 职场文书
MongoDB数据库的安装步骤
2021/06/18 MongoDB