Angular JS服务创建错误

Question

我已经创建了此服务。 并使用** enrollments.getProperty（）; **这个语句来调用这个服务，但它不工作我是新的角JS，请让我知道我犯了什么错误。

var helloAjaxApp = angular.module("myApp", []); 
 
helloAjaxApp.service('enrollments', [ '$scope', '$http', function ($scope, $http) { 
 
\t 
 
\t $http.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded; charset=utf-8"; 
 
    var enrollments = null; 
 
    enrollment(); 
 
    $scope.enrollment=function() { 
 
    \t $http({ 
 
    \t url : 'enrollments', 
 
     method : "GET" 
 
    }).then(function(response) { 
 
     
 
    \t enrollments = response.data; 
 
     alert("enrollments"); 
 
    }); 
 
    }; 
 
    return { 
 
     getProperty: function() { 
 
      return enrollments; 
 
     }, 
 
     setProperty: function(value) { 
 
     \t enrollments = value; 
 
     } 
 
    }; 
 
}]);

Answer 1

使用angular.module（）

(function() { 
    'use strict'; 
    angular.module("helloAjaxApp") 
     .service('enrollments', ['$scope', '$http', function ($scope, $http) { 
      $http.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded; charset=utf-8"; 
      var enrollments = null; 
      enrollment(); 
      $scope.enrollment = function() { 
       $http({ 
        url: 'enrollments', 
        method: "GET" 
       }).then(function (response) { 

        enrollments = response.data; 
        alert("enrollments"); 
       }); 
      }; 
      return { 
       getProperty: function() { 
        return enrollments; 
       }, 
       setProperty: function (value) { 
        enrollments = value; 
       } 
      }; 
     }]); 
}); 

Answer 2

角具有2种方式定义服务的：service和factory。

在这里你可以看到其中的差别：https://blog.thoughtram.io/angular/2015/07/07/service-vs-factory-once-and-for-all.html

的基本区别是，服务就像是一个构造函数，这样你就不会从它返回一个对象，但是可以定义使用this关键字属性：

this.getProperty = function() { 
    return enrollments; 
} 

使用工厂方法时，需要使用公开的属性/函数返回对象。

您使用出厂语法，所以只需更改定义中使用的工厂：

helloAjaxApp.factory('enrollments', [ '$scope', '$http', function ($scope, $http) 

Answer 3

你应该去一个适当的服务结构，像这样：

var helloAjaxApp = angular.module("myApp", []); 

function EnrollmentService($scope, $http) { 
    let _this = this; 
    this.enrollments = null; 
    this.getEnrollments = function() { 
     return $http({ 
      url: 'enrollments', 
      method: 'GET' 
     }).then(function(response) { 
      _this.enrollments = response.data; 
      return _this.enrollments; 
     }) 
    }; 

    this.setEnrollments = function(enrollments) { 
     _this.enrollments = enrollments; 
    } 
} 

helloAjaxApp.service('enrollments', ['$scope', '$http', EnrollmentService]); 

然后，使用该服务其他地方：

enrollmentService 
    .getEnrollments() 
    .then(function(enrollments) { 
     // You can use the data here. 
     console.log(enrollments); 
    }); 

Answer 4

控制器代码

login服务是你必须作为参数传递服务名称到控制器

var loginModule = angular.module('LoginModule',[]); 
loginModule.controller('logincontroller', ['$rootScope','$scope','$http','$window','$cookieStore', 
                'LoginService',logincontrollerFun ]); 

function logincontrollerFun($rootScope, $scope, $http, $window,$cookieStore, LoginService,RememberService) { 



    $scope.loginTest = function() { 

     LoginService.UserStatus($scope, function(resp) { 
      console.log("response of login controller ::: ", resp); 
      ///write ur code 

     }); 
    } 
} 

服务代码

var loginModule = angular.module('LoginModule') 
loginModule.factory("LoginService",[ '$http', LoginServiceFun ]) 

    function LoginServiceFun($http) { 
     function UserStatus($scope,callback){ 

       var targetRequestPath='./url'; 
       var targetRequestParamsREQ={'email':$scope.email,'password':$scope.passWord}; 
      return $http({ 
       method: 'POST', 
       url: targetRequestPath, 
       headers: {'Content-Type': 'application/json'}, 
       data: targetRequestParamsREQ 
      }).then(function (response){ 
       console.log('Response Data : ', response.data); 
       callback(response.data); 
      }) 
     } 
     return { 
      UserStatus:UserStatus 
      } 

     }