工厂未注入控制器 - 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 时，它不起作用。我在做什么 wearng。对你的帮助表示感谢。提前致谢。
注意：我也尝试将其创建为服务。这仍然不起作用。

Answer 1

您的服务存在提升问题：

'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);
        }
    }
}

}]);

Answer 2

虽然不建议在工厂和服务中访问 $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 3

这里的基本问题是您的工厂没有正确初始化。工厂定义不正确，因为您使用的是 $scope。 $scope 不是服务，而是对象。 $scope对象绑定到某些 html elements/context。我们可以将 $scope 与控制器一起使用，因为 Injector 在解析 html 元素时使用 $scope 初始化控制器。控制器与 html 元素关联，因此 Injector 知道控制器的 $scope。但是 services/factories 是单例对象。所以你不能在这里注入$scope。

如需进一步说明，您可以参考 Injecting $scope into an angular service function()

使用以下代码可以解决您的问题。我假设您已经定义了 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);

}
}]);

工厂未注入控制器 - angularJS

Factory is not getting injected into the controller - angularJS

javascript

dependency-injection

angularjs