Question

我是棱角分明的新手，我被告知最好让服务为控制器做繁重的工作，但我发现很难利用我创建的服务。我已经看到了几个问题，但我找不到解决方案。

这是我的服务

(function () {
  'use strict';

var office = angular.module('Office', []);

office.factory('auth', ['$http', '$localForage', '$scope', function ($http, $localForage, $scope) {

    var auth = {}

    auth.login = function (credentials) {
        $http.post('/auth_api/login', credentials)
            .then(function (data) {
                    $localForage.setItem('user', data.data)
                },
                function () {
                    $scope.login_error = 'Invalid Username/password'
                })
    }

    $localForage.getItem('user').then(function (data) {
        auth.isAuthenticated = !!data.id
    })

    return auth
}])

这是我的控制器

office.controller('LoginController', ['$scope', 'auth', function ($scope, auth) {

    $scope.login = auth.login($scope.user)
}])

Answer 1

我已经从您的代码创建了一个更简单的版本..并且它在这里工作。检查链接 - fiddle

app.factory('auth', ['$http', function ($http) {
    var auth = {};
    auth.login = function (credentials) {
      return "success";
    }
    return auth;
}]);

用您的实施替换登录功能

Answer 2

您的代码是正确的，但由于您没有从“auth”工厂返回任何内容，因此您无法在控制器中获得任何更新。如下所示更改代码以从工厂或任何确认登录的消息返回数据。

工厂：

 (function () {
  'use strict';

   var office = angular.module('Office', []);

   office.factory('auth', ['$http', '$localForage', '$scope', function ($http, $localForage, $scope) {

   var auth = {}

   auth.login = function (credentials) {
    return $http.post('/auth_api/login', credentials)
        .then(function (data) {
                $localForage.setItem('user', data.data);
                setAuthentication(true);
                return data.data; 
            },
            function (err) {
                return err;
            });
   }

   auth.setAuthentication = function (isLoggedIn){
     this.isAuthenticated = isLoggedIn;
   }

   return auth;
 }]);

控制器：

office.controller('LoginController', ['$scope', 'auth', function ($scope, auth) {
      $scope.login = function (){
       auth.login($scope.user).then(function (data){
         $scope.userDetails = data;
       }, function (err){
         $scope.loginError = 'Invalid Username/password';
       });
      }
}]);

如何使用带控制器的角度服务

2 个答案: