UI 路由器刷新页面而不是状态更改 [英] UI Router Refreshing Page Instead on State Change

问题描述

我在这个特定问题上运气不佳.我查找的所有内容都与尝试"刷新页面有问题的人有关，而不是我每次进入某个状态时都会刷新的问题.这只发生在 IE 中，而不是 chrome.

代码:

app.config(function ($stateProvider, $urlRouterProvider) {$stateProvider.state('盒子', {templateUrl: 模板路径 + 'box.html',控制器:'BoxController'，controllerAs: 'box',url: '/Box/{folder:string}'}).state('撰写', {templateUrl: templatePath + 'compose.html',控制器:'ComposeController'，controllerAs: '撰写',url: '/Compose/{messageSentId:int}'}).state('视图', {templateUrl: 模板路径 + 'view.html',控制器:'视图控制器'，控制器为:'视图'，url: '/Box/{folder:string}/{messageId:string}/{messageSentId:string}'});$urlRouterProvider.otherwise('/Box/');});

问题出在我的撰写状态.如果我像这样直接进入那个状态:​​

vm.compose = function () {$state.go('compose', { messageSentId: 0 }, { notify: true });};

它工作得很好.但是，如果我添加除 0 之外的其他数字并从不同的 controller 调用，则它不起作用:

vm.reply = function() {var id = Math.floor($stateParams.messageSentId);$state.go('compose', { messageSentId: id }, { notify: true });};

我认为它可能有问题，因为它认为 id 是一个字符串，因此与 /Compose/{messageSentId:int} 不匹配，所以我添加了Math.floor() 但这没有帮助.

需要注意的是，如果我先启动我的撰写功能并进入该状态，回复功能将起作用.但是，如果我首先尝试使用回复功能进行导航，页面会重新加载.

我可以确认的另一件事是该页面的 controller 和页面本身加载得很好.您实际上可以看到表单短暂地弹出.问题是一旦 controller 加载了刷新就会被触发.没有错误.没什么.简单地在 IE 中失败.

解决方案

经过数小时的研究，在网上没有发现与我的问题类似的问题后，我做了一个简单的更改.我将状态更改从控制器中移出并使用 ui-sref 代替:

代码:

<a class="btn btn-primary" ui-sref="compose({messageSentId: view.replyMessageId})"><i class="fa fa-reply"></i>回复</a>

其中view"是我的控制器，因为我不使用 $scope 并且我在变量 replyMessageId 上设置了我的 $stateparameter.也许这会对某人有所帮助.

I've had no luck with this particular issue. Everything I've looked up has to do with people having issues 'trying' to refresh the page instead of my issue where it's refreshing every time I go to a certain state. This ONLY happens in IE not chrome.

Code:

app.config(function ($stateProvider, $urlRouterProvider) {
    $stateProvider
        .state('box', {
            templateUrl: templatePath + 'box.html',
            controller: 'BoxController',
            controllerAs: 'box',
            url: '/Box/{folder:string}'
        })
        .state('compose', {
            templateUrl: templatePath + 'compose.html',
            controller: 'ComposeController',
            controllerAs: 'compose',
            url: '/Compose/{messageSentId:int}'
        })
        .state('view', {
            templateUrl: templatePath + 'view.html',
            controller: 'ViewController',
            controllerAs: 'view',
            url: '/Box/{folder:string}/{messageId:string}/{messageSentId:string}'
        });

    $urlRouterProvider.otherwise('/Box/');
});

The problem is with my compose state. If I go directly to that state like so:

vm.compose = function () {
   $state.go('compose', { messageSentId: 0 }, { notify: true });
};

It works just fine. However, if I add a different number besides 0 and call from a different controller it does not work:

vm.reply = function() {
   var id = Math.floor($stateParams.messageSentId);
   $state.go('compose', { messageSentId: id }, { notify: true });
};

I thought maybe it was having issues because it thought id was a string and therefore didn't match to /Compose/{messageSentId:int} so I added the Math.floor() but that didn't help.

Something to note is that if I fire my compose function first and go to that state the reply function will work. However, if I attempt to navigate with my reply function first the page reloads.

Another thing that I can confirm is that my controller for that page and the page itself loads just fine. You can actually see the form pop up briefly. The problem is once the controller has loaded a refresh is triggered. No errors. No nothing. Simply fails in IE.

解决方案

After many hours of research and having found nothing similar to my issue on the web I made a simple change. I moved my state change out of my controller and used ui-sref instead:

Code:

<div class="btn-group pull-right" ng-if="view.canReply()">
    <a class="btn btn-primary" ui-sref="compose({messageSentId: view.replyMessageId})">
        <i class="fa fa-reply"></i> Reply
    </a>
</div>

Where 'view' is my controllerAs since I don't use $scope and I set my $stateparameter on the variable replyMessageId. Maybe this will help someone.

这篇关于UI 路由器刷新页面而不是状态更改的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！