42.angularJS自定义服务
转自:https://www.cnblogs.com/best/tag/Angular/
1.
你可以创建自定义服务,链接到你的模块中:
<!DOCTYPE html>
<html> <head>
<meta charset="utf-8">
<script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head> <body>
<div ng-app="myApp" ng-controller="myCtrl"> <p>255 的16进制是:</p> <h1>{{hex}}</h1> </div> <p>自定义服务,用于转换16进制数:</p> <script>
var app = angular.module('myApp',[]);
app.service('hexafy',function(){
this.myFunc = function(x){
return x.toString(16);
}
});
app.controller('myCtrl',function($scope,hexafy){
$scope.hex = hexafy.myFunc(255);
});
</script> </body> </html>
2.
过滤器中,使用自定义服务
当你创建了自定义服务,并连接到你的应用上后,你可以在控制器,指令,过滤器或其他服务中使用它。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body> <div ng-app="myApp" ng-controller="myCtrl">
<p>在获取数组 [255, 251, 200] 值时使用过滤器:</p> <ul>
<li ng-repeat="x in counts">{{x | myFormat}}</li>
</ul> <p>过滤器使用服务将10进制转换为16进制。</p>
</div> <script>
var app = angular.module('myApp', []);
app.service('hexafy', function() {
this.myFunc = function (x) {
return x.toString(16);
}
});
app.filter('myFormat',['hexafy', function(hexafy) {
return function(x) {
return hexafy.myFunc(x);
};
}]);
app.controller('myCtrl', function($scope) {
$scope.counts = [255, 251, 200];
});
</script> </body>
</html>
42.angularJS自定义服务的更多相关文章
- 深究AngularJS——自定义服务详解(factory、service、provider)
前言 3种创建自定义服务的方式. Factory Service Provider 大家应该知道,AngularJS是后台人员在工作之余发明的,他主要应用了后台早就存在的分层思想.所以我们得了解下分 ...
- angularjs 自定义服务的三种方式
angularjs 中可通过三种($provider,$factory,$service)方式自定义服务,以下是不同的实现形式: // 定义module , module中注入$providevar ...
- angularJs自定义服务(实现签名和加密)
写在前面: angularJS是google公司主推的js开发优秀框架... 页面展示: 在应用中进行加密是普遍存在的,个人建议在前端实现加密签名(前端加密是否必要来自知乎:http://www.zh ...
- angularJs自定义服务
在AngularJS中,系统内置的服务都是以$开头,所以我们的自定义服务尽量避免以$开头.自定义服务的方式有如下几种: 使用Module的provider方法 使用Module的factory方法 使 ...
- angularJs 自定义服务 provide 与 factory 的区别
<!DOCTYPE html> <html lang="en" ng-app="myApp"> <head> <met ...
- angularjs 自定义服务(serive,factory,provder) 以及三者的区别
1.Serive 服务:通过service方式创建自定义服务,相当于new的一个对象:var s = new myService();,只要把属性和方法添加到this上才可以在controller里调 ...
- angularjs 自定义服务
<!DOCTYPE HTML> <html ng-app="myApp"> <head> <meta http-equiv="C ...
- angularJS自定义服务的几种方式
在angularJS中定义服务共有四种常见的方式:factory,service,provider,constant,value 使用形式的不同: 1)factory以返回对象的形式定义服务: mya ...
- angularJS——自定义服务provider之$get
可以认为provider有三个部分: 第一部分是私有变量和私有函数,这些变量和函数会在以后被修改. 第二部分是在app.config函数里可以访问的变量和函数,所以,他们可以在其他地方使用之前被修改. ...
随机推荐
- ZOJ 3687
赤裸的带禁区的排列数,不过,难点在于如何用程序来写这个公式了.纠结了好久没想到,看了看别人的博客,用了DFS,实在妙极,比自己最初想用枚举的笨方法高明许多啊.\ http://blog.csdn.ne ...
- android 推断手机是否支持前置摄像头
话不多说 直接上代码, @SuppressLint("NewApi") public static boolean isSupportFrontCamera() { if (!ha ...
- Chisel实验笔记(四)
在<Chisel实验笔记(二)>中.通过编写TestBench文件,然后使用Icarus Verilog.GtkWave能够測试,查看相关波形.比較直观,在<Chisel实验笔记(三 ...
- CCFlow的excel数据源导入Dtl明细表的操作方法以及模版demo
CCBPM支持通过excel向Dtl明细表(从表)导入数据. 以下,我们以cc的財务报销单demo流程解说详细的操作步骤和模版设计. 导入的操纵步骤: 1.流程发起后,在開始节点导入数据源,点击明细表 ...
- apiCloud中实现头部与内容分离与操作规范,App头部header固定,头部与内容分离
官方案例 1.头部拆分成一个页面比如news-text <!doctype html> <html> <head> <meta charset="u ...
- [luogu P1776] 宝物筛选 解题报告(单调队列优化DP)
题目链接: https://www.luogu.org/problemnew/show/P1776 题目: 终于,破解了千年的难题.小FF找到了王室的宝物室,里面堆满了无数价值连城的宝物……这下小FF ...
- 循环访问 TreeView 控件的所有节点
创建测试每个节点的递归过程 . private void PrintRecursive(TreeNode treeNode) { // Print the node. System.Diagnosti ...
- CSS中元素各种居中方法(思维导图)
前言 用思维导图的方式简单总结一下各种元素的居中方法,如下图: 补充一下: table自带功能 100% 高度的 afrer before 加上 inline block优化 div 装成 table ...
- Ajax :六个全局事件
加载请求: .ajaxStart() 和 .ajaxstop() $(document).ajaxStart(function(){ $('.loading').show(); }).ajaxStop ...
- POJ 1852 Ants O(n)
题目: 思路:蚂蚁相碰和不相碰的情况是一样的,相当于交换位置继续走. 代码: #include <iostream> #include <cstdio> #include &l ...