Question

我正在尝试关注this example以显示特定状态的引导模式。它没有模态工作正常（所以状态配置应该没问题）。应该可以使用所有需要的依赖项（即角度引导程序）。

当我在console.debug($stateParams)之前执行$modal.open时，我在$modal.open - 方法中获取了正确的数据但是返回了上一个状态的stateParams（我来自的状态）

任何提示？

修改

相关国家cfg：

.state('publications.view', {
    parent: 'publications.productSelection',
    url: '/{productSlug:[a-zA-Z0-9-]+}/{docID:[0-9]+}_{slug:[a-zA-Z0-9-]+}',
    onEnter: ['restFactory', '$state', '$stateParams', '$modal',
        function(restFactory, $state, $stateParams, $modal) {
            console.debug($stateParams.docID);
            $modal.open({

                templateUrl: 'partials/publication.html',
                resolve: {
                    publication: ['restFactory', '$stateParams',
                        function(restFactory, $stateParams) {
                            console.debug($state.params);
                            console.debug($stateParams);
                            return restFactory.view($stateParams.language, $stateParams.productSlug, $stateParams.docID);
                        }
                    ]
                },
                controller: ['$scope', '$sce', 'publication', '$rootScope',
                    function($scope, $sce, publication, $rootScope) {
                        $rootScope.pageTitle = publication.data.data.publication.Publication.title;
                        $scope.publication = $sce.trustAsHtml(publication.data.data.publication.Publication.content);
                    }
                ]
            });
        }
    ]
});

Answer 1

你可以通过将当前的$ stateParams注入onEnter函数来解决这个问题，在某些服务中将它们保存为状态，然后将该服务注入模态结果中。

我正在调整此处的代码：Using ui-router with Bootstrap-ui modal

.provider('modalState', function($stateProvider) {
    var modalState = {
        stateParams: {},
    };

    this.$get = function() {
        return modalState;
    };

    this.state = function(stateName, options) {
        var modalInstance;
        $stateProvider.state(stateName, {
            url: options.url,
            onEnter: function($modal, $state, $stateParams) {
                modalState.stateParams = $stateParams;
                modalInstance = $modal.open(options);
                modalInstance.result['finally'](function() {
                    modalInstance = null;
                    if ($state.$current.name === stateName) {
                        $state.go('^');
                    }
                });
            },
            onExit: function() {
                if (modalInstance) {
                    modalInstance.close();
                }
            }
        });
    };
})

然后在您的应用配置部分

.config(function($stateProvider, $urlRouterProvider, modalStateProvider) {
    modalStateProvider.state('parent.child', {
        url: '/{id:[0-9]+}',
        templateUrl: 'views/child.html',
        controller: 'ChildCtrl',
        resolve: {
            role: function(Resource, modalState) {
                return Resource.get({id: modalState.stateParams.id}).$promise.then(function(data) {
                    return data;
                });
            }
        }
    });
}

无法使用angular和ui.routes打开模态

1 个答案: