ionic准备之angular基础———服务provider 和 factory和service(9)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body ng-app="myApp">
<div ng-controller="firstController">
<ul>
<li ng-repeat="item in name">{{item}}</li>
</ul>
</div>
</body>
<script src="angular/angular.js"></script>
<script type="text/javascript">
var app=angular.module("myApp",[],function($provide){
/*创建服务factory*/
$provide.factory("myFactory",function(){
var server={};
server.getMessage=function(){
return "this is a message";
} return server;
});
/*用provider创建服务*/
$provide.provider("myprovider2",function(){ this.$get=function(){
var server={};
server.getMessage=function(){
return "this is provider2";
} return server;
} });
}); /*也可以再config中定义服务*/
app.config(function($provide){
/*自定义服务*/
$provide.provider("myProvider",function(){
this.$get=function(){ var server={};
server.getName=function(){
var name={
name:"tanxu",
nickName:"xuxu"
} return name;
}
return server;
} });
}); app.controller('firstController',function($scope,$filter,myProvider,myprovider2,myFactory){
//用provider
$scope.name=myProvider.getName();
console.log($scope.name); $scope.name1=myprovider2.getMessage(); console.log($scope.name1);
//
//用factory
$scope.msg=myFactory.getMessage();
console.log($scope.msg);
}); </script>
</html>
我们可以再config中创建服务,或者在module中直接创建,利用provider创建需要this.get()匿名函数,而factory可以直接返回字符串或者对象,建议基于对象去返回。
那么这样会不会太乱,当然还有更好更直观的创建方式
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body ng-app="myApp">
<div ng-controller="firstController">
<ul>
<li ng-repeat="item in name">{{item}}</li>
</ul>
</div>
</body>
<script src="angular/angular.js"></script>
<script src="service.js"></script>
<script type="text/javascript">
var app=angular.module("myApp",['myService']); //引入服务依赖 /*定义服务*/
app.service("service1",function(){
return {
message:"qwewe"
}
}) /*定义服务,用provider必须使用get方法*/
app.provider("provider1",function(){
this.$get=function(){
return {
message:"q34234324"
}
} }) /*定义服务*/
app.factory("myfactory",function(){
return {
message:"myfactory"
}
}) /**/
app.controller('firstController',function($scope,service1,provider1,myfactory,getMessageFactory){
console.log(service1);
console.log(provider1);
console.log(myfactory); /*引入外置文件的服务getMessageFactory*/
console.log(getMessageFactory.getMessage());
}); </script>
</html>
上面案例引入了一个外部的js,该js专用于定义各种服务
/**
* Created by Administrator on 2016/3/28.
*/
var service=angular.module('myService',[]); service.service('getMessageFactory',function(){
var service={};
service.getMessage=function(){
return "这是外置文件的js服务";
}
return service;
}) service.service('getMessageFactory1',function(){
var service={};
service.getMessage=function(){
return "这是外置文件的js服务1";
}
return service;
}) service.service('getMessageFactory2',function(){
var service={};
service.getMessage=function(){
return "这是外置文件的js服务2";
}
return service;
})
在html中的mudule要记得引入依赖关系,引入依赖之前当然你要确保你的service.js已经引入进页面中来了
ionic准备之angular基础———服务provider 和 factory和service(9)的更多相关文章
- angularjs中provider,factory,service的区别和用法
angularjs中provider,factory,service的区别和用法 都能提供service,但是又有差别 service 第一次被注入时实例化,只实例化一次,整个应用的生命周期中是个单例 ...
- angularJS 服务-$provide里factory、service方法
当你初试 Angular 时,很自然地就会往 controller 和 scope 里堆满不必要的逻辑.一定要早点意识到,controller 这一层应该很薄:也就是说,应用里大部分的业务逻辑和持久化 ...
- ionic准备之angular基础——格式化数据以及过滤器(8)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- ionic准备之angular基础——dom操作相关(6)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- ionic准备之angular基础——模板引入(7)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- ionic准备之angular基础——$watch,$apply,$timeout方法(5)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- ionic准备之angular基础——run方法(4)
可以看到整个angular.module对象具有以下各种属性和方法 <!DOCTYPE html> <html lang="en"> <head> ...
- ionic准备之angular基础——继承(3)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 深究AngularJS——自定义服务详解(factory、service、provider)
前言 3种创建自定义服务的方式. Factory Service Provider 大家应该知道,AngularJS是后台人员在工作之余发明的,他主要应用了后台早就存在的分层思想.所以我们得了解下分 ...
随机推荐
- Python-Python及PyCharm的下载与安装
一.简介 Python:英 -[‘paɪθ ə n]或[‘paɪθɑn] 89年诞生 可用于软件开发: 游戏后台.搜索.图形界面 网站 C\S(Client/Server)软件 科学计算 亦可以进行系 ...
- 百度之星复赛T5&&hdu6148
Problem Description 众所周知,度度熊非常喜欢数字. 它最近发明了一种新的数字:Valley Number,像山谷一样的数字. 当一个数字,从左到右依次看过去数字没有出现先递增接着递 ...
- Dinic算法学习&&HDU2063
http://www.cnblogs.com/SYCstudio/p/7260613.html 看这篇博文懂了一点,做题再体会体会吧 找了好久都没找到一个好用的模板…… 我也是佛了..最后决定用峰神的 ...
- 借教室(NOIP2012)
原题传送门 其实就是求能满足多少个订单.. 然后搞上差分, 又因为如果前n个能够满足,那么前m个一定能满足(m<n) 所以可以二分(重点!) 然后乱搞..就AC了(其实也挺麻烦的...233~) ...
- Kerberos(转:http://www.cnblogs.com/jankie/archive/2011/08/22/2149285.html)
Kerberos介绍(全) 微软Windows Server 2003操作系统实现Kerberos 版本5的身份认证协议.Windows Server 2003同时也实现了公钥身份认证的扩展.Ke ...
- #424 Div2 C
#424 Div2 C 题意 给出 k 个分数,初始分数未知,按顺序把这 k 个分数加到初始分数上,已知 n 个加入分数后的结果(无序),问初始分数有多少种可能. 分析 也就是说这 n 个结果,它们之 ...
- 「JXOI2018」游戏
注意输出的应该是 所有方案的和,,而不是期望. 我们不妨把依赖关系建图,可以发现 所有没有入度的点都被查水表了一次 是 游戏结束的 充要条件. 于是我们只需要知道有多少没有入度的点,然后再排列算一算就 ...
- 【bzoj1485:】【 [HNOI2009]有趣的数列】模任意数的卡特兰数
(上不了p站我要死了,侵权度娘背锅) Description 我们称一个长度为2n的数列是有趣的,当且仅当该数列满足以下三个条件: (1)它是从1到2n共2n个整数的一个排列{ai}: (2)所有的奇 ...
- Akka Cluster之集群分片
一.介绍 当您需要在集群中的多个节点之间分配Actor,并希望能够使用其逻辑标识符与它们进行交互时,集群分片是非常有用的.你无需关心Actor在集群中的物理位置,因为这可能也会随着时间的推移而发生变 ...
- 四. Java继承和多态10. Java Object类
Object 类位于 java.lang 包中,是所有 Java 类的祖先,Java 中的每个类都由它扩展而来. 定义Java类时如果没有显示的指明父类,那么就默认继承了 Object 类.例如: p ...