Question

这是我的LoginController，因为你可以看到我注入了LoginService，我似乎无法弄清楚为什么我会收到上面提到的错误（注意：我已经制作了通过在separates文件夹中打破我的项目来进行模块化，使用gulp和browserify将所有内容捆绑到一个文件中）

'use strict';

function LoginController($scope, $ionicModal, $timeout, $location,
                         $ionicLoading, $ionicPopup, LoginService) {

  // With the new view caching in Ionic, Controllers are only called
  // when they are recreated or on app start, instead of every page change.
  // To listen for when this page is active (for example, to refresh data),
  // listen for the $ionicView.enter event:
  //$scope.$on('$ionicView.enter', function(e) {
  //});

  // Form data for the login modal
  $scope.loginData = {};

  // Create the login modal that we will use later
  $ionicModal.fromTemplateUrl('js/modules/login/login.html', {
    scope: $scope
  }).then(function(modal) {
    $scope.modal = modal;
  });

  // Triggered in the login modal to close it
  $scope.closeLogin = function() {
    $scope.modal.hide();
  };

  // Open the login modal
  $scope.login = function() {
    $scope.modal.show();
  };

  $scope.show = function() {
    $ionicLoading.show({
      template:'<p>Loading...</p><ion-spinner></ion-spinner>'
    });
  };
 $scope.hide = function(){
   $ionicLoading.hide();
 };

  // Perform the login action when the user submits the login form
  $scope.doLogin = function() {
    console.log('Doing login', $scope.loginData);

    // Start showing the progress
    $scope.show($ionicLoading);


    // Do the call to a service using $http or directly do the call here
    LoginService.login($scope.loginData).success(function(data) {
      // Do something on success for example if you are doing a login

        console.log('Login successful', data);

    }).error(function(data) {
      // Do something on error
      console.log('Login failed', data);


    }).finally(function($ionicLoading) {
      // On both cases hide the loading
      console.log('Hide');

      $scope.hide($ionicLoading);
    });
  };
}

module.exports = ['$scope', '$ionicModal', '$timeout','$location',
                  '$ionicLoading','LoginService','$ionicPopup',
                   LoginController];

这是我的LoginService文件，这对我来说非常奇怪，因为我已经注入了相应的文件，但我仍然收到上面提到的错误。非常感谢任何帮助或指导。

'use strict';

function LoginService($http, $q, API_ENDPOINT) {
  var BASE_URL = API_ENDPOINT.url;
  var LOCAL_TOKEN_KEY = 'yourTokenKey';
  var isAuthenticated = false;
  var authToken;


  function storeUserCredentials(token) {
    window.localStorage.setItem(LOCAL_TOKEN_KEY, token);
    useCredentials(token);
  }

  function useCredentials(token) {
    isAuthenticated = true;
    authToken = token;

    // Set the token as header for your requests!x-access-token'
    $http.defaults.headers.common.Authorization = authToken;
  }

  var login = function(user) {
    return $q(function(resolve, reject) {
      $http.post(BASE_URL + '/authenticate', user).then(function(result){
        if (result.data.success) {
          storeUserCredentials(result.data.token);
          resolve(result.data.msg);
        }else{
          reject(result.data.msg);
        }
      });
    });
  };

  return {
    login: login,
    isAuthenticated: function() {return isAuthenticated;},
  };


}

module.exports = ['$http', '$q', 'API_ENDPOINT', LoginService];

这是我的login.js文件，位于上面发布的目录

中

'use strict';

module.exports = angular.module('login', [])
    .factory('LoginService', require('./login-service'))
    .controller('LoginController', require('./login-controller'));

Answer 1

您应首先执行require，然后才定义服务。由于您直接在require中传递.factory('LoginServie，因此需要注册服务名称，但其正文是空的。

我对require的工作量不大，但您可以尝试：

require('./login-service');

module.exports = angular.module('login', [])
    // Make this code synchornous that this should only run when above require loaded the script
    .factory('LoginService', LoginService)
    .controller('LoginController', require('./login-controller'));

或（可能）

require('./login-service', function() {
    module.exports = angular.module('login', [])
        .factory('LoginService', LoginService)
        .controller('LoginController', require('./login-controller'));
})

Answer 2

使用工厂时，您将获得实际的类，并且需要实例化它。使用服务时，您将获得该服务的实例。请看下面的示例：AngularJS : Factory and Service?

我一直得到angularjs服务不是一个函数错误（LoginService.login不是一个函数）

2 个答案: