<!DOCTYPE html>
<html ng-app="myServiceModule">
<head>
<meta charset="utf-8">
<script src="https://wx.gtimg.com/bower_components/angular/angular.js"></script>
</head>
<body ng-controller="MyController">
<div>
<p>Let's try this simple notify service, injected into the controller...</p>
<p> {{ name }} (you have to click 3 times to see an alert)</p>
</div>
<script>
var app = angular.module('myServiceModule',[]);
app.controller('MyController', ['$scope', function ($scope) {
$scope.name="hello world";
}]);
</script>
</body>
</html>
再来给factory增加点功能
<!DOCTYPE html>
<html ng-app="myServiceModule">
<head>
<meta charset="utf-8">
<script src="https://wx.gtimg.com/bower_components/angular/angular.js"></script>
</head>
<body >
<div ng-controller="MyController">
<p>Let's try this simple notify service, injected into the controller...</p>
<input ng-init="message='test'" ng-model="message">
<button ng-click="callNotify(message);">notify </button>
<p> {{ name }} (you have to click 3 times to see an alert)</p>
</div>
<div ng-controller="MyController2">
<input ng-model="message1">
<button ng-click="callNotify(message1);">notify </button>
</div>
<script>
var app = angular.module('myServiceModule',[]);
app.factory('notify',function(){
var msgs = [];
return function(msg){
msgs.push(msg);
console.log(msg + " "+ msgs.length);
if(msgs.length == 3){
alert("hello world");
msgs=[];
}
}
});
app.controller('MyController', ['$scope','notify', function ($scope,notify) {
$scope.callNotify = function (msg){
notify(msg);
}
}]);
app.controller('MyController2', ['$scope','notify', function ($scope,notify) {
$scope.callNotify = function (msg){
notify(msg);
}
}]);
</script>
</body>
</html>
再增加一个控制器
<!DOCTYPE html>
<html ng-app="myServiceModule">
<head>
<meta charset="utf-8">
<script src="https://wx.gtimg.com/bower_components/angular/angular.js"></script>
</head>
<body >
<div ng-controller="MyController">
<p>Let's try this simple notify service, injected into the controller...</p>
<input ng-init="message='test'" ng-model="message">
<button ng-click="callNotify(message);">notify </button>
<p> {{ name }} (you have to click 3 times to see an alert)</p>
</div>
<div ng-controller="MyController2">
<input ng-model="message1">
<button ng-click="callNotify(message1);">notify </button>
</div>
<script>
var app = angular.module('myServiceModule',[]);
app.factory('notify',function(){
var msgs = [];
return function(msg){
msgs.push(msg);
console.log(msg + " "+ msgs.length);
if(msgs.length == 3){
alert("hello world");
msgs=[];
}
}
});
app.controller('MyController', ['$scope','notify', function ($scope,notify) {
$scope.callNotify = function (msg){
notify(msg);
}
}]);
app.controller('MyController2', ['$scope','notify', function ($scope,notify) {
$scope.callNotify = function (msg){
notify(msg);
}
}]);
</script>
</body>
</html>
在Angular里面,services作为单例对象在需要到的时候被创建,只有在应用生命周期结束的时候(关闭浏览器)才会被清除。而controllers在不需要的时候就会被销毁了。这就是为什么使用controllers在应用里面传递数据不可靠的原因
factory和services的区别
Factory和Services是最常用的两种方法,Service针对于对象会工作的更好一些,Factory可以编写JavaScript原语和函数
版权声明:本文为博主原创文章,未经博主允许不得转载。
原文地址:http://blog.csdn.net/u013011841/article/details/47298307