Question

我正在使用角度UI路由器而不使用HTML5模式。以下是路由器配置。我正在为订单处理应用程序的每个步骤使用嵌套视图。订购流程的每个步骤都取决于之前的步骤我的问题是在订购流程的第2步或第3步浏览器刷新;所有输入数据都会丢失，因此我希望将用户重定向到订购流程的初始 第1步

  $stateProvider
        .state('wizard', {
            url: "/wizard",
            templateUrl: 'template/newOrder.cshtml',
            controller: 'createOrderController',
            controllerAs: 'vm',
            data: { pageTitle: 'Wizard form' }
        })
        .state('wizard.step_one', {
            url: '/step_one',
            templateUrl: 'template/step1.cshtml',
            controller: 'orderStep1Controller',
            controllerAs:'vm',
            data: { pageTitle: 'Wizard form' }
        })
        .state('wizard.step_two', {
            url: '/step_two',
            templateUrl: 'template/step2.cshtml',
            controller: 'orderStep2Controller',
            controllerAs: 'vm',
            data: { pageTitle: 'Wizard form' }
        })
        .state('wizard.step_three', {
            url: '/step_three',
            templateUrl: 'template/step3.cshtml',
            controller: 'orderStep3Controller',
            controllerAs: 'vm',
            data: { pageTitle: 'Wizard form' }
        })
    .state('wizard.step_four', {
        url: '/step_four',
        templateUrl: 'template/step4.cshtml',
        controller: 'orderStep4Controller',
        controllerAs: 'vm',
        data: { pageTitle: 'Wizard form' }
    })
    ;

此致

Answer 1

我假设/wizard状态除了持有嵌套视图之外实际上没有做任何事情。

您可能需要更改一些内容以使其成为抽象视图以保存所有状态，包括将neworder.cshtml更改为其自己的状态：

.state('wizard', {
        url: "/wizard",
        abstract: true,
        templateUrl: 'template/newOrder.cshtml',
        controller: 'createOrderController',
        controllerAs: 'vm',
        data: { pageTitle: 'Wizard form' }
    })

可以找到更深入的信息以及如何使用抽象Ui-Router GitHub

它包含有关如何执行urlRouterRedirects的gret信息，在这种情况下可能会有用，具体取决于您希望它发生的时间。你可以说当你落在向导视图上以重定向到neworder（例如下面）

$ urlRouterProvider.when（＆＃39; / wizard＆＃39;，＆＃39; / wozard / neworder＆＃39;）;

如果您想在特定事件后捕获它，您还可以使用.otherwise。

$ urlRouterProvider.otherwise（＆＃39; /否则＆＃39）;

/ url必须像往常一样在一个州上定义：

$ stateProvider .state（＆＃34;否则＆＃34;，{url：＆＃39; /否则＆＃39; ...}）

AngularJs：UI路由器浏览器刷新，移动到第一个子状态？

1 个答案: