Question

我一直试图使用Angularjs和Typescript将工厂注入控制器，但我收到此错误Error: [$injector:unpr] http://errors.angularjs.org/1.2.9/$injector/unpr?p0=AuthenticationProvider%20%3C-%20Authentication。

我一直在研究，但无法找到解决方案，因为我所做的与某些解决方案类似。

这是我的登录控制器模块

import Authentication = require('AuthenticationService');
module LoginController{

export interface UIMainScope extends ng.IScope {
    login: (credential: any) => void;
}

export class Controller {
    static $inject = ['$scope', '$http', 'Main', 'Authentication'];
    constructor (){}
}
export = LoginController
angular.module('App').controller('Controller', LoginController.Controller);

我忘了在这里注入一些东西来调用方法吗？

Answer 1

这里的问题与以下事实有关：角度$inject无法从Typescript require中获利。这些是独立的功能，它们代表不同的概念。

角度[$inject][1]，作为内置Dependency Injection，只能注入已注册的内容。它没有对Typescript对象的任何访问权限 - 只有它自己的（angular的）对象工厂。

如错误所示：未知提供商'AuthenticationProvider'，我们必须致电：

angular.module('App')
  .factory('Authentication', [... its dependencies ...
      , (params) => new Authentication(params)]);

现在，我们确实已准备好角度验证，我们可以在Controller内部要求

语法可能如下所示：

// module with Scope and Controller
module LoginController
{
  export interface UIMainScope extends ng.IScope 
  {
    login: (credential: any) => void;
  }

  export class Controller
  {
    // constructor, instantiating private members this.$scope ...
    constructor($scope: UIMainScope
       , $http :ng.IHttpService
       , Main: any
       , Authentication: any)
    ...
  }
}

// and finally pass it into angular as .controller()
angular.module('App')
  .controller('Controller', [
     '$scope', '$http', 'Main', 'Authentication',
     ($scope, $http, Main, Authentication)  =>
     {
        return new LoginController.Controller($scope, $http, Main, Authentication);
     }
]);

最后：在某些情况下，Authentication提供商不会从使用Angular启动的产品中获利，我们也可以使用它。我们根本不需要对它进行反应。只需调用require，并访问其方法......但我们必须跳过angular $inject进程......

这可能不是这种情况，但想象一下QueryStringBuilder ...只能消耗方法Builder.build(...)

中传递的参数

Answer 2

好像你没有专门注册角度为Authentication的服务：

angular.module('App').controller('Controller', LoginController.Controller)
    // fix based on your code 
    .service('Authentication',Authentication.AuthenticationService);

此视频可能有所帮助：https://www.youtube.com/watch?v=Yis8m3BdnEM&hd=1

将工厂注入控制器angularjs + typescript

2 个答案: