ng 自定义服务
服务的本质是对象。
创建服务的常见方式:
factory(返回对象) service (方法、属性)constant(常量服务) value(变量服务)
1、factory
app.factory('服务名称',function(){
return {
key:value
}
})
2、service方法
app.service('服务名称',function(){
//构造函数
this.name = 'zhangsan';
this.speak = function(){}
})
3、constant value
app.constant('服务名称',{})
app.value('服务名称',{})
<!DOCTYPE html>
<html ng-app="myApp">
<head lang="en">
<meta charset="UTF-8">
<script src="js/angular.js"></script>
<title></title>
</head>
<body>
<div ng-controller="myCtrl">
<button ng-click="handleClick()">
clickMe
</button>
</div>
<script>
var app = angular.module('myApp', ['ng']); //通过factory自定义服务
app.factory('$output', function () {
return {
print: function (str) {
//比较复杂的业务逻辑
console.log(str);
}
}
}); app.controller('myCtrl',
function ($scope,$output) {
$scope.handleClick = function () {
$output.print('Hello Service');
}
})
</script>
</body>
</html>
2.
<!DOCTYPE html>
<html ng-app="myApp">
<head lang="en">
<meta charset="UTF-8">
<script src="js/angular.js"></script>
<title></title>
</head>
<body>
<div ng-controller="myCtrl"> </div>
<script>
var app = angular.module('myApp', ['ng']); //通过service方法创建服务
app.service('$student', function () {
//构造函数
this.name = 'lucy';
this.study = function () {
console.log('正在学习');
}
}); app.controller('myCtrl',
function ($scope,$student) {
//读取服务中的属性
console.log("服务中name属性对应的值为"+$student.name);
//调用服务中的方法
$student.study();
})
</script>
</body>
</html>
ng 自定义服务的更多相关文章
- ng自定义服务(利用factory)
ng中我们可以自己定义自己的服务,服务中是一些使用重复率较高的方法.因此有效的使用服务可以提高开发速度. ng中定义服务的方法有多种,service,factory,provide,在此我只介绍最长用 ...
- AngularJs学习笔记5——自定义服务
前面整理了AngularJs双向数据绑定和自定义指令的相关内容,从手册上看也知道,ng部分还包括过滤器和函数,以及服务等. 过滤器:filter,就是对数据进行格式化,注意管道格式,例如: {{表达式 ...
- Angular factory自定义服务
<!DOCTYPE html><html ng-app="myApp"><head lang="en"> <meta ...
- angularjs 自定义服务的三种方式
angularjs 中可通过三种($provider,$factory,$service)方式自定义服务,以下是不同的实现形式: // 定义module , module中注入$providevar ...
- angularJs自定义服务(实现签名和加密)
写在前面: angularJS是google公司主推的js开发优秀框架... 页面展示: 在应用中进行加密是普遍存在的,个人建议在前端实现加密签名(前端加密是否必要来自知乎:http://www.zh ...
- angularJs自定义服务
在AngularJS中,系统内置的服务都是以$开头,所以我们的自定义服务尽量避免以$开头.自定义服务的方式有如下几种: 使用Module的provider方法 使用Module的factory方法 使 ...
- Angular JS 学习笔记(自定义服务:factory,Promise 模式异步请求查询:$http,过滤器用法filter,指令:directive)
刚学没多久,作了一个小项目APP,微信企业号开发与微信服务号的开发,使用的是AngularJS开发,目前项目1.0版本已经完结,但是项目纯粹为了赶工,并没有发挥AngularJS的最大作用,这几天项目 ...
- Dynamics AX 2012 R2 在增强入站端口中找不到自定义服务操作
Reinhard写好自定义服务A,添加好服务操作A1,A2,A3..... 然后,Reinhard在增强的入站端口,选择服务操作时,却找不到这些A1,A2,A3. 查找相关资料 ...
- angularJs 自定义服务 provide 与 factory 的区别
<!DOCTYPE html> <html lang="en" ng-app="myApp"> <head> <met ...
随机推荐
- Kattis - cokolada【水】
Kattis - cokolada[水] 题意 有一个人想吃巧克力,但是巧克力都是按照 2 的幂次的数量包装的,然后他想吃一定数量块的巧克力,然后可以敲碎,每次敲碎都分成两半,比如四块装的分成两块就是 ...
- HDU 4370 - 0 or 1 (SPFA+思维)
题意:给一个N*N的矩阵C,和一个N*N的只由0和1组成的矩阵X. X满足以下条件: 1.X 12+X 13+...X 1n=1 2.X 1n+X 2n+...X n-1n=1 3.任意 i (1 ...
- Libev和LibEvent
libev和libevent功能基本相同,名称相近,到底该用哪一个呢?zhouhh@zhh64:~$ sudo apt-cache search libeventlibevent-dev – Deve ...
- hadoop单击模式环境搭建
一 安装jdk 下载相应版本的jdk安装到相应目录,我的安装目录是/usr/lib/jdk1.8.0_40 下载完成后,在/etc/profile中设置一下环境变量,在文件最后追加如下内容 expor ...
- grid布局笔记
1.应用 display: grid 的元素.这是所有网格项(Grid Items)的直接父级元素.即容器 2.网格容器(Grid Container)的子元素(直接子元素). 3.注意:在 网格容器 ...
- VRChat简易教程1-开发环境准备(SDK)
原文:https://docs.vrchat.com/docs/setting-up-the-sdk 1 Unity 2017.4.15f1 下载地址https://download.unity3d. ...
- 《Language Implementation Patterns》之 语言翻译器
语言翻译器可以从一种计算机语言翻译成另外一种语言,比如一种DSL的标量乘法axb翻译成java就变成a*b:如果DSL里面有矩阵运算,就需要翻译成for循环.翻译器需要完全理解输入语言的所有结构,并选 ...
- Book Review of “The practice of programming” (Ⅳ)
The practice of programming Chapter 4 Interfaces A good programmer should always be good at designin ...
- java判断集合list是为空
if(null == list || list.size() ==0 ){ } list.isEmpty()和list.size()==0 没有区别 isEmpty()判断有没有元素而size()返回 ...
- windows 下android react native详细安装配置过程
写在前面: 在网上搜了很多安装配置文档,感觉没有一个真的跟我安装的过程一模一样的,东拼拼西凑凑,总算是装好了,我不会告诉你,断断续续,我花了两天时间...一到黑屏报错就傻眼,幸好在react群里遇到了 ...