高效利用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 相关文章推荐
用jscript启动sqlserver
Jun 21 Javascript
javascript cookie解码函数(兼容ff)
Mar 17 Javascript
jquery一般方法介绍 入门参考
Jun 21 Javascript
变量声明时命名与变量作为对象属性时命名的区别解析
Dec 06 Javascript
用js编写的简单的计算器代码程序
Aug 04 Javascript
全面了解JS中的匿名函数
Jun 29 Javascript
jQuery中show与hide方法用法示例
Sep 16 Javascript
微信小程序授权获取用户详细信息openid的实例详解
Sep 20 Javascript
JS基于对象的链表实现与使用方法示例
Jan 31 Javascript
vuejs移动端实现div拖拽移动
Jul 25 Javascript
原生JS实现顶部导航栏显示按钮+搜索框功能
Dec 25 Javascript
javascript 代码是如何被压缩的示例代码
May 06 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
颠覆常识!无色透明的咖啡诞生了(中日双语)
2021/03/03 咖啡文化
PHP扩展Memcache分布式部署方案
2015/12/06 PHP
YII使用url组件美化管理的方法
2015/12/28 PHP
Smarty环境配置与使用入门教程
2016/05/11 PHP
laravel + vue实现的数据统计绘图(今天、7天、30天数据)
2018/07/31 PHP
PhpStorm配置Xdebug调试的方法步骤
2019/02/02 PHP
jQuery使用$.get()方法从服务器文件载入数据实例
2015/03/25 Javascript
js实现顶部可折叠的菜单工具栏效果实例
2015/05/09 Javascript
探讨JavaScript中的Rest参数和参数默认值
2015/07/29 Javascript
javascript显示上周、上个月日期的处理方法
2016/02/03 Javascript
老生常谈js-react组件生命周期
2017/05/02 Javascript
vue2.0结合Element实现select动态控制input禁用实例
2017/05/12 Javascript
在Swiper内如何制作CSS3动画效果示例代码
2017/12/07 Javascript
jQuery实现为动态添加的元素绑定事件实例分析
2018/09/07 jQuery
你或许不知道的一些npm实用技巧
2019/07/04 Javascript
wx-charts 微信小程序图表插件的具体使用
2019/08/18 Javascript
vue实现倒计时获取验证码效果
2020/04/17 Javascript
echarts实现折线图的拖拽效果
2019/12/19 Javascript
用云开发Cloudbase实现小程序多图片内容安全监测的代码详解
2020/06/07 Javascript
通过vue刷新左侧菜单栏操作
2020/08/06 Javascript
swiper实现导航滚动效果
2020/12/13 Javascript
Python备份Mysql脚本
2008/08/11 Python
python将人民币转换大写的脚本代码
2013/02/10 Python
复习Python中的字符串知识点
2015/04/14 Python
老生常谈Python进阶之装饰器
2017/05/11 Python
Python网络爬虫与信息提取(实例讲解)
2017/08/29 Python
在python中用url_for构造URL的方法
2019/07/25 Python
python3文件复制、延迟文件复制任务的实现方法
2019/09/02 Python
Python搭建代理IP池实现获取IP的方法
2019/10/27 Python
Python3 解决读取中文文件txt编码的问题
2019/12/20 Python
国际金融专业大学生职业生涯规划书
2013/12/28 职场文书
北京故宫的导游词
2015/01/31 职场文书
小学生暑假安全公约
2015/07/14 职场文书
《梅花魂》教学反思
2016/02/18 职场文书
CSS中em的正确打开方式详解
2021/04/08 HTML / CSS
ssh服务器拒绝了密码 请再试一次已解决(亲测有效)
2022/08/14 Servers