工廠未注入控制器-angularJS

Question

我是angularJS的新手。 我試圖在我的應用程序中將服務分離到單獨的文件中。 一切正常，但是當我嘗試將工廠對象注入控制器時，它無法正常工作。 下面是代碼

這是應用程序文件
app.js

'use strict';

var app = angular.module('myApp', ['ngRoute']);  
app.config(function ($routeProvider, $controllerProvider,

          $compileProvider, $filterProvider, $provide) {
app.controllerProvider = $controllerProvider;
app.compileProvider = $compileProvider;
app.routeProvider = $routeProvider;
app.filterProvider = $filterProvider;
app.provide = $provide;


app.routeResolver = function (basePath, viewName,controllerName, isSecure) {
    var routeConf =
        {
            templateUrl: 'Views/' + basePath + viewName + '.html',
            controller: controllerName + 'Controller',
            secure: isSecure ? isSecure : false,
            resolve: {
                deps: function ($q, $rootScope) {
                    var deferred = $q.defer();
                    var dependencies =
                    [
                        'Controllers/' + basePath + controllerName + 'Controller.js',
                    ];

                    require(dependencies, function () {
                        $rootScope.$apply(function () {
                            deferred.resolve();
                        });
                    });

                    return deferred.promise;
                }
            }
        }
    return routeConf;

}

$routeProvider
.when('/', {})
.when('/Admin', app.routeResolver('Admin/', 'Admin','Admin'))
.when('/Customer', app.routeResolver('Customer/', 'Customer','Customer'))
.when('/Teller', app.routeResolver('Teller/', 'Teller','Teller'))
.when('/Finance', app.routeResolver('Finance/', 'Finance','Finance'))   
.otherwise({ redirectTo: '/' });
});

這是我的工廠
AuthenticationService.js

'use strict';

app.factory('authenticationService', ['$scope', 'httpService', function ($scope,      httpService) {

return {
    authenticateUser: function () {
        if (!$scope.userName && !$scope.keyWord) {
            var result = httpService.postService(
                 {
                     username: $scope.userName,
                     keyword: $scope.keyWord
                 }, "../api/authenticateUser");
            result.then(successCall, errorCall);
        }
    }
}

successCall =function(dataObject) {

}

errorCall = function (dataObject) {

}

}]);

這是我的控制器
LoginController.js

'use strict';

app.controller('LoginController', ['$scope','authenticationService',  function ($scope, authenticationService) {

$scope.ValidateLogin = function () {
    var result = window.confirm("Validate Login Called for the user :" + $scope.userName);
    var result1 = authenticationService.authenticateUser();

}
}]);

當我不注入authenticationservice時，logincontroller工作正常。 但是，當我嘗試注入authenticationservice時，它不起作用。 我在干什么。 對你的幫助表示感謝。 提前致謝。
注意：我也嘗試將其創建為服務。 仍然這是行不通的。

Answer 1

盡管不建議在工廠和服務內部訪問$ scope，但是可以使用angular.element(ELEMENT).scope() 。

但是最好使您的身份驗證服務接受用戶名和密碼，並且不對其當前范圍進行任何假設以使其可重復使用：

authenticateUser: function (username, password) {
    ...... // 
    return result.then(successCall, errorCall); // return the promise 
}

然后在您的控制器中：

$scope.ValidateLogin = function () {
 ....//
     authenticationService.authenticateUser($scope.username, $scope.password)
         .then(function(response){
          // deal with the response here
          });

}

Answer 2

這里的基本問題是您的工廠未正確初始化。 工廠定義不正確，因為您正在使用$scope 。 $scope不是服務，而是對象。 $scope對象綁定到一些html元素/上下文。 我們可以用$scope為噴油器與控制器的初始化與控制器$scope在解析HTML元素。 控制器與html元素相關聯，因此Injector知道控制器的$scope 。 但是服務/工廠是單例對象。 因此，您不能在此處注入$scope 。

有關其他說明，請參閱將$ scope注入角度服務函數（）

使用以下代碼可以解決您的問題。 我假設您已經定義了httpsService 。

app.factory('authenticationService', ['httpService', function (httpService) {

return {
    authenticateUser: function (context) {
        if (!context.userName && !context.keyWord) {
            var result = httpService.postService(
                 {
                     username: context.userName,
                     keyword: context.keyWord
                 }, "../api/authenticateUser");
            result.then(successCall, errorCall);
        }
    }
}

app.controller('LoginController', ['$scope','authenticationService',  function ($scope, authenticationService) {

$scope.ValidateLogin = function () {
    var result = window.confirm("Validate Login Called for the user :" + $scope.userName);
    var result1 = authenticationService.authenticateUser($scope);

}
}]);

Answer 3

您的服務存在吊裝問題：

'use strict';

app.factory('authenticationService', ['$scope', 'httpService', function ($scope,      httpService) {

//define them here before the return, if not, they won't be defined
var successCall =function(dataObject) {

}

var errorCall = function (dataObject) {

}

return {
    authenticateUser: function () {
        if (!$scope.userName && !$scope.keyWord) {
            var result = httpService.postService(
                 {
                     username: $scope.userName,
                     keyword: $scope.keyWord
                 }, "../api/authenticateUser");
            result.then(successCall, errorCall);
        }
    }
}

}]);