从stateprovider

Question

我有一个常见的确认模式服务，已经创建并在另一个模态中使用 - 创建用户。在创建用户控制器中，当用户单击取消确认模式时，我调用下面的onModalCancel来关闭创建用户模式

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

现在我尝试在用户使用/ new-user url时从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＆lt; - $ modalInstance＆lt; - mo.pages.shared.modals.NewUserModalController 。 我知道在NewUserModalController中有$ modalInstance的依赖项，我试图通过传递$ modalInstance来解决这个问题，但仍然会收到此错误！ NewUserModalController定义如下：

(function () {
'use strict';

angular
    .module('mo.pages.shared.modals')
    .controller('mo.pages.shared.modals.NewUserModalController', NewUserModalController);

NewUserModalController.$inject = [
    'headerText', '$window', '$q', '$modalInstance', 'mo.common.ConfirmationModalService'
];

function NewUserModalController(headerText, $window, $q, $modalInstance, ConfirmationModalService) {

/* Logic */

}})();

如果我尝试使用$ modal.open直接从控制器打开模态并传递模板，则模态打开没有问题。当我尝试使用stateprovider

打开模态时，它会出现问题

Answer 1

请写下

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

或

 .config(newUserRouteConfiguration);

然后你没有注射问题

Answer 2

我通过为模式创建服务 NewUserModalService 解决了这个问题，因此从 NewUserModalController 中删除了 $ modalInstance 依赖项并添加了 NewUserModalService 依赖关系，而不是在RouteConfiguration中使用 templateUrl 和 controller ，我使用了 OnEnter 功能。参考：[https://github.com/angular-ui/ui-router/wiki/][1]Frequently-Asked-Questions#how-to-open-a-dialogmodal-at-a-certain-state 的 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;
    }

}

}）（）;