时间戳

首页 > 解决方案 > Typescript 中的控制器继承与缩小导致错误：$injector:unpr Unknown Provider

angularjs - Typescript 中的控制器继承与缩小导致错误：$injector:unpr Unknown Provider

问题描述

更新 2019/07/16

我的问题实际上是由于使用不当引起的$inject。我使用它private $inject，api-service.ts但它应该是public static $inject = [...]。丑化时依赖显式注入但private $inject隐式注入

我对这篇文章有一个非常相似的问题。我的错误消息不是tProvider未知的，而是具有特定的提供者名称，但看起来像

未知提供者：eProvider <- e <- api-service <- baseDI-service

其中api-service和baseDI-service是同一模块的命名和注册服务。

我的模块如下所示：

module
--api-service
--other-services
--baseDI-service
--componentA
----controllerA extends BaseController
--componentB
----controllerB extends BaseController

例如，我将导入api-service和其他服务baseDI-service用作服务容器，因为我不想在super()componentA 中传递很多参数。

所以在componentA中它看起来像：

...
class ComponentAController extends BaseController {
    public static $inject = ['baseDI-service', ...];

    constructor(baseDIService: BaseDIService) {
        ...
        super(baseDIService); 
        ...
    }
}

BaseDIService.ts：

export default class BaseControllerDIService {
    public static $inject = ['api-service', '$http', ...];
    constructor(
        private apiSvc: ApiService,
        private $http: ng.IHttpService,
        ...
    ) {}

    public getBaseClassDependencies() {
        return{
            apiService: this.apiSvc,
            $http : this.$http
            ... : ...
        };
    }
}

BaseController.ts

export default class BaseController implements ng.IComponentController {    
    apiService: ApiService;
    $http: ng.IHttpService;

    constructor(
        baseDIService: BaseDIService
    ) {
        const services = baseDIService.getBaseClassDependencies();
        this.$http = services.$http;        
        this.apiSvc = services.apiService;
        ...
        this.otherService = services.otherServices;
        ...
    }

在Grunt Uglify缩小后，错误类似于 Unknown provider: serviceAProvider <- serviceA. 没有缩小，一切都好。

在此之前，我还尝试使用与在 controllerA 中$injector相同的方式baseDI-service将其传递给super()，并且在我使用的 BaseController 中$injector.get('api-service')，我只遇到了与缩小相同的问题。

谁能告诉我为什么我在Uglify缩小模式下尝试的两种方式都失败了，如何解决？顺便说一句，我确实需要缩小。

此外，为 AngularJS 使用控制器继承是一种好习惯吗？

标签： angularjstypescriptminifyangularjs-controllergrunt-contrib-uglify

解决方案

为了帮助您在 uglify 之前发现此类问题，请使用 Strict Dependency Injection。

从文档：

使用严格的依赖注入

ng-strict-di您可以在同一元素上添加指令ng-app以选择进入严格 DI 模式：

<!doctype html>
<html ng-app="myApp" ng-strict-di>
<body>
  I can add: {{ 1 + 2 }}.
  <script src="angular.js"></script>
</body>
</html>

每当服务尝试使用隐式注释时，严格模式都会引发错误。

有关详细信息，请参阅

推荐阅读