首页 > 代码库 > 自定义服务 factory 和 service

自定义服务 factory 和 service

1、使用factory 方法
必须有返回值 即return ,factory只是调用普通的function,可以返回任何东西。

HTML 代码

<body ng-app="myApp">
 <div ng-controller="myCtrl">
     <ul>
         <li>{{data.name}}</li>
         <li>{{data.age}}</li>
         <li>{{data.phone}}</li>
     </ul>
     <p>{{strfun("hello")}}</p>
     <p>{{array(1)}}</p>
 </div>
</body>

  JS代码

<script type="text/javascript">
    var app=angular.module(‘myApp‘,[]);
    //返回一个JSON对象
    app.factory(‘$outData‘, function(){
        var data=http://www.mamicode.com/{"自定义服务"+ text;
            }
        }
        //返回一个数组
    }).factory(‘$myArray‘,function(){
        return [‘1‘,‘12‘,‘123‘];
    });
      //控制器层  注入服务
      app.controller(‘myCtrl‘,[‘$scope‘,‘$outData‘,‘$myFun‘,‘$myArray‘,function($scope,$outData,$myFun,$myArray){
            $scope.data=http://www.mamicode.com/$outData;>

  运行结果

      技术分享

2、service 方法自定义服务
这个方法可以接受一个构造函数,不用返回东西,在注入服务时,angular会检测到是service创建的服务,会自动调用new关键字来实例化这个服务,生成服务对象。service是一个构造器。

HTML 代码

<body ng-app="myApp">
 <div ng-controller="myCtrl">
            <p>{{name}}</p>
            <p>{{age}}</p>
            <p>{{phone}}</p>
            <p>{{fun()}}</p>      
 </div>

 JS 代码

<script type="text/javascript">  
var app=angular.module(‘myApp‘,[]);
     //返回一个构造函数
     app.service(‘mydata‘,function(){
         this.name=‘Tom‘,
         this.age=18,
         this.phone=‘12346789021‘,
         this.fun=function(){
             return "service ";
         }
     });
    //注入服务
 app.controller(‘myCtrl‘,function($scope,mydata){
        $scope.name=mydata.name;
        $scope.age=mydata.age;
        $scope.phone=mydata.phone;
        $scope.fun=function(){
            return mydata.fun();
        }
    });
 </script>

  运行结果

技术分享

 这是今天自己的学习笔记,分享给大家啦,有些地方不足希望大家多多提出,不知道大家有没有好的学习方法可以分享给我。。。

 

自定义服务 factory 和 service