angular factory Services provider 自定义服务 工厂

转载于

作者:海底苍鹰
地址:http://blog.51yip.com/jsjquery/1602.html

1.在app.js 中声明了模块的依赖

var phonecatApp = angular.module('phonecatApp', [
'ngRoute',
'phonecatControllers',
'directivesmy',
'servicesmy',  //服务依赖关系
'pascalprecht.translate'
]);

2. 在service.js 中写自定义服务 工厂  提供...

'use strict';


var appservices=angular.module('servicesmy', []);

// factory
appservices.factory('factorytest',['$window',function($window){
    var test={
        firstname:"xie",
        lastname:function(){
            return "xie";
        }
    };
    $window.alert('factorytest'); //内置服务可以注入
    return test;
}]);
/* Services */
appservices.service('servicetest',['$window',function($window){
    $window.alert("servicetest");
    this.firstname="thank";
    this.lastname=function(){
        return "zhang";
    }
}
    ]);
// provider
appservices.provider('providertest',[
    function(){
        this.test={
            "firstname":"xie",
            "lastname":"ni",
        }
        this.$get=function(){
            return this.test;
        }
    }
    ]);

3. 在控制器中 controllers.js  调用自定义服务

//引进自定义的服务 
phonecatControllers.controller('SomeController',function($scope,factorytest,servicetest,providertest) {
    $scope.title = '点击展开';
    $scope.text = '这里是内部的内容。';
       $scope.facetorytests = factorytest.firstname+" "+factorytest.lastname();  
        $scope.servicetests = servicetest.firstname+" "+servicetest.lastname();  
        $scope.providertests = providertest.firstname+" "+providertest.lastname; 
});

4. 在HTML中 显示效果

       <p>{{facetorytests}}</p>
        <p>{{servicetests}}</p>
        <p>{{providertests}}</p>

 5.Server 和factory 可以实现controller 之间的数据共享；而不是通过调用共同的从conctroller 来共享数据；

。。。。。。。。。