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是后台人员在工作之余发明的,他主要应用了后台早就存在的分层思想.所以我们得了解下分 ...
随机推荐
- 汕头市队赛 SRM10 T1模拟只会猜题意
模拟只会猜题意 SRM 10 描述 有一本n个单词的词典,求按下列方法能造出的不相同的词汇数目. 1.词典中的单词是一个词. 2.能分为两部分的,其中前一部分是一个词典词或者其非空前缀,后一部分是一 ...
- 【CF1016F】Road Projects（贪心）
题意:给你一棵n 个节点的树,定义1到n的代价是1到 n节点间的最短路径的长度. 现在给你 m 组询问,让你添加一条边权为 w 的边(不与原图重复),求代价的最大值.询问之间相互独立. 1≤n,m≤3 ...
- Java笔记（一）
1. ConcurrentModificationException 在遍历容器的同时修改容器里的成员对象可能会抛出该异常 http://www.blogjava.net/EvanLiu/archiv ...
- 求强连通块_Tarjan算法_C++
好久没有写算法了,就放一个 Tarjan 上来凑凑数哈 强连通块由若干个点组成,任意点与点之间可以之间或间接到达,显然可以看作一个环 下面是伪代码 强记:dfn为时间不变,low取最小,下一个dfn有 ...
- C++自带向量_vector_C++
vector 向量,是C++自带的一种容器,其实就是一个升级版的数组 因为它使用的是动态空间,所以当我们不确定数组空间的时候可以使用它 若要使用需打开头文件 #include<vector> ...
- Less的用法
Less常用来写样式,比较多的用法是使用第三方软件编译成CSS文件,然后在HTML页面引入CSS文件.而不是直接在HTML页面里引入编译文件和Less文件.如此以来,在后期修改方便的多.当然,在写小项 ...
- 【原创】DataPackage-数据库、表的区域设置和系统不一致导致处理失败
问题描述: 最近学习Datapackage,创建完之后,部署处理但总是提示某某字段的区域设置和目标字段的区域设置不一致,具体如图: 测试发现其它的数据库表又没有这类的问题发生,甚是苦恼,搜寻了好久,后 ...
- 全文索引CONTAINS语法
Like直接在数据据中查找可以查到所有所需记录但是会扫描整个表会影响性能CONTAINS是基于全文索引进行查询,查询结果受系统全文索引分词的方法影响查询结果会不全.Select * FROM A Wh ...
- HDU 1203 【01背包/小数/概率DP】
I NEED A OFFER! Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) Tot ...
- FZU-2268 Cutting Game(二进制使用）
Problem 2268 Cutting Game Accept: 254 Submit: 605Time Limit: 1000 mSec Memory Limit : 32768 K ...