Question

有许多关于在进入特定状态时打开模态窗口的文档，有些人使用'onEnter'，其他人使用'$ stateChangeStart'事件。

但我遇到的问题是，当直接转到该网址时，模态窗口下面没有加载任何内容。

例如： 1.用户访问www.mysite.com 2.用户单击打开模型的链接：www.mysite.com/#/signup 3.用户看到注册模式窗口，其中包含

下的原始内容

但是当用户直接访问www.mysite.com/#/signup时，就不会发生这种情况。

目前我有一条处理我所有模态窗口的父路线，如下所示：

$stateProvider
    .state('modal', {
        parent: 'home',
        abstract: true,
        url: '',
        data: {
            modal: true  
        },
        onEnter: ['$state', '$modal', function($state, $modal) {
            console.log('open modal'); 

            $modal.open({
                template: '<div ui-view="modal"></div>',
                backdrop: true
            }).result.then(function() {
                $state.go('home'); 
            }, function(reason) {
                if(!reason || reason == 'backdrop click') $state.go('home');   
            });
        }]
    });

虽然这有效，但我希望能够动态设置父路由，因为这将是我的模态窗口下面的内容。

有没有办法做到这一点？或者是否有任何其他方法允许我打开模态窗口，其中包含下面的任何内容？

Answer 1

使用UI-Router Extra - Sticky States帮助我解决了我的问题，当你直接打开一个模态时，有一些问题是没有底层状态，但那些问题是可以解决。 http://christopherthielen.github.io/ui-router-extras/#/sticky

具有父状态的ui-router模态窗口

1 个答案: