Angularjs 未知提供程序：$modalInstance从stateprovider访问modal时

我有一个通用的确认模式服务，已经在另一个模式创建用户中创建和使用。在createusercontroller中，当用户单击确认模式的Cancel时，我调用下面的onModalCancel来关闭createuser模式

vm.onModalCancel = function onModalCancel() {
        return ConfirmationModalService.openModal({
                modalTitle: vm.resourceIdFor.cancelThisUpload
            })
            .then(function (modalResponse) {
                if (modalResponse.isConfirmed()) {
                    $modalInstance.dismiss('cancel');
                    return;
                }
                return;
            });
    };

现在，当用户使用/newuserurl时，我尝试从stateprovider路由打开模式，如下所示

(function () {
'use strict';

angular
    .module('mo.pages.new-user.layouts', ['ui.router', 'ui.bootstrap'])
    .config(['$stateProvider', newUserRouteConfiguration]);

function newUserRouteConfiguration($stateProvider, $modalInstance) {
    $stateProvider
        .state('new-user', {
            url: '/new-user/{objectType:int}/{objectId:int}',
            templateUrl: 'modules/pages/shared/modals/new-user/new-user-modal.html',
            controller: 'mo.pages.shared.modals.NewUserModalController as vm',              
            windowClass: 'new-user-modal',
            resolve: {
                headerText: function () {
                    return 'header';
                }
            }
        });
}})();

我面临的问题是，我得到了错误-未知提供程序：$modalInstanceProvider请编写

 .config(['$stateProvider','$modalInstance', newUserRouteConfiguration]);

或

那么您在注射方面就没有问题了

请写信

 .config(['$stateProvider','$modalInstance', newUserRouteConfiguration]);

或

---

那么您就没有注入问题了

我通过为模式创建一个服务NewUserModalService解决了这个问题，因此，从NewUserModalController中删除了$modalInstance依赖项，并添加了NewUserModalService依赖项，而不是在RouteConfiguration中使用templateUrl和controller，我使用了oneter函数。参考：[ NewUserModalService

(function () {

'use strict';

angular
    .module('mo.pages.shared.services')
    .factory('mo.pages.shared.services.NewUserModalService', newUserModalServiceFactory);

newUserModalServiceFactory.$inject = [
    '$modal'
];
function newUserModalServiceFactory($modal) {
    var modalInstance;
    var service = {
        shownewUserModal: shownewUserModal
    };

    return service;

    function dismissNewUserModal() {
        try {
            if (!modalInstance) {
                return;
            }
            modalInstance.close();
            $modal.close();
        } catch (e) {
        }
    }

    function showNewUserModal(headerText) {
        modalInstance = $modal.open({
            templateUrl: 'modules/pages/shared/modals/new-user/new-user-modal.html',
            controller: 'mo.pages.shared.modals.NewUserModalController as vm',
            windowClass: windowClass,
            backdrop: 'static',
            size: 'lg',
            resolve: {
                dismissFn: function () {
                    return dismissNewUserModal;
                },
                headerText: function () {
                    return headerText;
                }
            }
        });

        return modalInstance;
    }

}

---

})（）；

我解决了这个问题，为模式创建了一个服务NewUserModalService，因此从NewUserModalController中删除了$modalInstance依赖项，并添加了NewUserModalService依赖项，并在RouteConfiguration中使用了该依赖项，而不是使用templateUrl和controllernter功能。请参阅：[ NewUserModalService

(function () {

'use strict';

angular
    .module('mo.pages.shared.services')
    .factory('mo.pages.shared.services.NewUserModalService', newUserModalServiceFactory);

newUserModalServiceFactory.$inject = [
    '$modal'
];
function newUserModalServiceFactory($modal) {
    var modalInstance;
    var service = {
        shownewUserModal: shownewUserModal
    };

    return service;

    function dismissNewUserModal() {
        try {
            if (!modalInstance) {
                return;
            }
            modalInstance.close();
            $modal.close();
        } catch (e) {
        }
    }

    function showNewUserModal(headerText) {
        modalInstance = $modal.open({
            templateUrl: 'modules/pages/shared/modals/new-user/new-user-modal.html',
            controller: 'mo.pages.shared.modals.NewUserModalController as vm',
            windowClass: windowClass,
            backdrop: 'static',
            size: 'lg',
            resolve: {
                dismissFn: function () {
                    return dismissNewUserModal;
                },
                headerText: function () {
                    return headerText;
                }
            }
        });

        return modalInstance;
    }

}

---

})（）

显示您的代码以定义

NewUserModalController

您可能忘记了$modalInstanceprovider@RonBrogan我已经在“NewUserModalController”的定义中添加了$modalInstance。我已经用控制器的定义编辑了上面的问题。您使用的是什么版本的ui引导？它们是最近改为使用uib作为前缀，这可能是怎么回事吗？应该是$uibModalInstance。如果不是，你能创建一个plunkr（或类似的）吗演示您的问题？@RonBrogan我们正在使用angular bootstrap v0.13.4，未升级。整个应用程序使用$modalInstance的旧实例。当我遇到此错误时，我首先验证了这一点。显示

NewUserModalController

定义的代码您可能忘记了$modalInstanceprovider@RonBrogan我已经在“NewUserModalController”的定义中添加了$modalInstance。我已经用控制器的定义编辑了上面的问题。您使用的是什么版本的ui引导？他们最近更改为使用uib作为前缀，这可能是怎么回事吗？应该是$uibModalInstance。如果不是，您可以创建一个PRUNKR吗（或类似）演示您的问题？@RonBrogan我们正在使用angular bootstrap v0.13.4，未升级。整个应用程序使用$modalInstance的旧实例。当我遇到此错误时，我验证了第一件事。嗨，simon，如果我尝试这样做，（我已经尝试过的第一步，给出了无法实例化模块的错误，原因是：错误：[$injector:modulerr]未能实例化模块mo.pages.new-user，原因是：错误：[$injector:modulerr]未能实例化模块mo.pages.new-user.layouts，原因是：错误：[$injector:unpr]未知提供程序：$modalInstanceHi simon，如果我尝试这么做，（我已经尝试过的第一步，给出了实例化模块失败的错误，原因是：错误：[$injector:modulerr]未能实例化模块mo.pages.new-user原因：错误：[$injector:modulerr]未能实例化模块mo.pages.new-user.layouts原因：错误：[$injector:unpr]未知提供程序：$modalInstance