高效利用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 相关文章推荐
出现“不能执行已释放的Script代码”错误的原因及解决办法
Aug 29 Javascript
JS画5角星方法介绍
Sep 17 Javascript
js判断60秒以及倒计时示例代码
Jan 24 Javascript
jquery的each方法使用示例分享
Mar 25 Javascript
jquery单行文字向上滚动效果的实现代码
Sep 05 Javascript
js+css实现的圆角边框TAB选项卡滑动门代码分享(2款)
Aug 26 Javascript
Google 地图叠加层实例讲解
Aug 06 Javascript
AngularJS中$watch和$timeout的使用示例
Sep 20 Javascript
js基本算法:冒泡排序,二分查找的简单实例
Oct 08 Javascript
Vue过滤器的用法和自定义过滤器使用
Feb 08 Javascript
jQuery滚动监听实现商城楼梯式导航效果
Mar 06 Javascript
JavaScript修改注册表实例代码
Jan 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
wordpress自定义url参数实现路由功能的代码示例
2013/11/28 PHP
php检测数组长度函数sizeof与count用法
2014/11/17 PHP
php实现用手机关闭计算机(电脑)的方法
2015/04/22 PHP
Zend Framework框架教程之Zend_Db_Table_Rowset用法实例分析
2016/03/21 PHP
详解PHP安装mysql.so扩展的方法
2016/12/31 PHP
PHP实现与java 通信的插件使用教程
2019/08/11 PHP
DHTML 中的绝对定位
2006/11/26 Javascript
JS 跳转页面延迟2种方法
2013/03/29 Javascript
jquery 跳到顶部和底部动画2句代码简单实现
2013/07/18 Javascript
javascript中怎么做对象的类型判断
2013/11/11 Javascript
jquery获取颜色在ie和ff下的区别示例介绍
2014/03/28 Javascript
JQuery使用index方法获取Jquery对象数组下标的方法
2015/05/18 Javascript
JavaScript中的pow()方法使用详解
2015/06/15 Javascript
JavaScript中的return语句简单介绍
2015/12/07 Javascript
jQuery Easyui学习教程之实现datagrid在没有数据时显示相关提示内容
2016/07/09 Javascript
KnockoutJS 3.X API 第四章之事件event绑定
2016/10/10 Javascript
简单谈谈JS数组中的indexOf方法
2016/10/13 Javascript
基于Vue的SPA动态修改页面title的方法(推荐)
2018/01/02 Javascript
详解封装基础的angular4的request请求方法
2018/06/05 Javascript
Vue自定义属性实例分析
2019/02/23 Javascript
vue实现记事本功能
2019/06/26 Javascript
Vue+elementui 实现复杂表头和动态增加列的二维表格功能
2019/09/23 Javascript
js函数和this用法实例分析
2020/03/13 Javascript
[01:11:21]DOTA2-DPC中国联赛 正赛 VG vs Elephant BO3 第一场 3月6日
2021/03/11 DOTA
使用Python的PIL模块来进行图片对比
2016/02/18 Python
python爬虫框架scrapy实现模拟登录操作示例
2018/08/02 Python
python在TXT文件中按照某一字符串取出该字符串所在的行方法
2018/12/10 Python
TensorFlow低版本代码自动升级为1.0版本
2021/02/20 Python
canvas实现飞机打怪兽射击小游戏的示例代码
2018/07/09 HTML / CSS
英国发展最快的在线超市之一:Click Marketplace
2021/02/15 全球购物
农药学硕士毕业生自荐信
2013/09/25 职场文书
中学生自我评价范文
2014/02/08 职场文书
亲属关系公证书
2014/04/08 职场文书
写好Python代码的几条重要技巧
2021/05/21 Python
MySql 8.0及对应驱动包匹配的注意点说明
2021/06/23 MySQL
MYSQL 表的全面总结
2021/11/11 MySQL