Question

我有一个包含大量Angular代码的MVC应用程序。我有一个Angular服务，可以创建一个Angular UI模式。相关代码是：

export class ConfirmRenderingOfLargeResultsModalService {

    static $inject = ["$uibModal"];
    constructor(private $uibModal: any) {
    }

    public open(options: LargeResultSetModalOptions): ng.IPromise<LargeResultsModalAction> {
        var modalInstance = this.$uibModal.open(
            {
                templateUrl: "myTemplate.html",
                controller: "ConfirmRenderingOfLargeResultsModalController",
                controllerAs: "confirmRenderingOfLargeResultsModalController",
                backdrop: "static",
                resolve: {
                    modalOptions: () => options
                }
            });

        return modalInstance.result.then((action: LargeResultsModalAction) => {
            return action;
        });
    }
}

angular.module("My.Module").service("Services.ConfirmRenderingOfLargeResultsModalService", Services.ConfirmRenderingOfLargeResultsModalService);

控制器（摘录）是：

export class ConfirmRenderingOfLargeResultsModalController {
    public confirmRenderingOfLargeResultsModalController: ConfirmRenderingOfLargeResultsModalController = this;

    //static $inject = ["$uibModalInstance"];
    constructor(private $uibModalInstance: any, private modalOptions: LargeResultSetModalOptions) {

    }

    public ok(): void {
        this.$uibModalInstance.close(LargeResultsModalAction.Continue);
    }

    // more methods not shown
}

angular.module("My.Module").controller("Services.ConfirmRenderingOfLargeResultsModalController", Services.ConfirmRenderingOfLargeResultsModalController);

现在，在我的开发环境中，这很好用。模式弹出，控制器正确注入了$ uibModalInstance和modalOptions参数。在生产中，启用捆绑后，它会中断 - 完全没有任何事情发生。没有控制台错误。

如果我取消注释控制器上的静态注入行，那么它在dev中断，在生产中弹出模式但不能正常工作，因为可能不是服务实例化的模态实例，因为modalOptions参数仍未定义。

我的问题是，如何缩小此代码并仍然注入$ uibModalInstance的正确实例？希望我错过了一些非常简单的事情，今天所有的头发都只是一种挫败感。

Answer 1

我建议你使用所谓的安全或内联依赖注入注释。

例如在您的控制器中：

angular.module("My.Module")
    .controller("Services.ConfirmRenderingOfLargeResultsModalController", ["uibModalInstance", "modalOptions", Services.ConfirmRenderingOfLargeResultsModalController]);

这将在您缩小代码时保留依赖项名称。

TypeScript缩小了Angular UI Modal

1 个答案: