• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >AngularJS > 高效利用Angular中内置服务$http、$location等

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

作者:fareise 字体:[增加 减小] 来源:互联网 时间:2017-05-30

本文主要包含高效利用Angular中内置服务$http、$location等等相关知识,fareise 希望在学习及工作中可以帮助到您

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

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

 这里为$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; 
 }); 
}); 
</div>

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); 
}); 
</div>

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

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

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

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

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

</div>

您可能想查找下面的文章:

相关文章

  • 2017-05-30AngularJs bootstrap搭载前台框架——准备工作
  • 2017-05-30Angular中实现树形结构视图实例代码
  • 2017-05-30AngularJS的内置过滤器详解
  • 2017-05-30Angular.js中处理页面闪烁的方法详解
  • 2017-05-30利用JavaScript的AngularJS库制作电子名片的方法
  • 2017-05-30Angular ng-class详解及实例代码
  • 2017-05-30Augularjs-起步详解
  • 2017-05-30详解AngularJS Filter(过滤器)用法
  • 2017-05-30AngularJS 霸道的过滤器小结
  • 2017-05-30在AngularJS框架中处理数据建模的方式解析

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • 初识angular框架后的所思所想
    • AngularJS Bootstrap详细介绍及实例代码
    • angular route中使用resolve在uglify压缩后问题解决
    • 什么是 AngularJS?AngularJS简介
    • 详解AngularJS 路由 resolve用法
    • angularjs中的单元测试实例
    • AngularJS基础 ng-if 指令用法
    • 时间转化+angualr模态框
    • 浅析AngularJS中的指令
    • 浅谈angular懒加载的一些坑

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有