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 来共享数据；

。。。。。。。。。