重新加载当前状态 - 刷新数据

本文翻译自:Reloading current state - refresh data

I'm using Angular UI Router and would like to reload the current state and refresh all data / re-run the controllers for the current state and it's parent. 我正在使用Angular UI路由器,并希望重新加载当前状态并刷新所有数据/重新运行控制器以获取当前状态及其父级。

I have 3 state levels: directory.organisations.details 我有3个州级别: directory.organisations.details

directory.organisations contains a table with a list of organisations. directory.organisations包含一个包含组织列表的表。 Clicking on an item in the table loads directory.organisations.details with $StateParams passing the ID of the item. 单击表中的项目会加载directory.organisations.details并使用$ StateParams传递项目的ID。 So in the details state I load the details for this item, edit them and then save data. 因此,在详细信息状态下,我加载此项目的详细信息,编辑它们,然后保存数据。 All fine so far. 到目前为止都很好。

Now I need to reload this state and refresh all the data. 现在我需要重新加载此状态并刷新所有数据。

I have tried: 我试过了:

 $state.transitionTo('directory.organisations');

Which goes to the parent state but doesn't reload the controller, I guess because the path hasn't changed. 哪个进入父状态,但没有重新加载控制器,我想因为路径没有改变。 Ideally I just want to stay in the directory.organisations.details state and refresh all data in the parent too. 理想情况下,我只想保留在directory.organisations.details状态并刷新父级中的所有数据。

I have also tried: 我也尝试过:

$state.reload()

I have seen this on the API WIKI for $state.reload "(bug with controllers reinstantiating right now, fixing soon)." 我在API WIKI for $ state.reload上看过这个“(控制器现在重新修复的错误,很快就会修复)。”

Any help would be appreciated? 任何帮助,将不胜感激?


#1楼

参考:https://stackoom.com/question/1T6yN/重新加载当前状态-刷新数据


#2楼

This solution works in AngularJS V.1.2.2: 此解决方案适用于AngularJS V.1.2.2:

$state.transitionTo($state.current, $stateParams, {
    reload: true,
    inherit: false,
    notify: true
});

#3楼

That would be the final solution. 那将是最终的解决方案。 (inspired by @Hollan_Risley's post) (灵感来自@ Hollan_Risley的帖子)

'use strict';

angular.module('app')

.config(function($provide) {
    $provide.decorator('$state', function($delegate, $stateParams) {
        $delegate.forceReload = function() {
            return $delegate.go($delegate.current, $stateParams, {
                reload: true,
                inherit: false,
                notify: true
            });
        };
        return $delegate;
    });
});

Now, whenever you need to reload, simply call: 现在,无论何时需要重新加载,只需调用:

$state.forceReload();

#4楼

I found this to be the shortest working way to refresh with ui-router: 我发现这是用ui-router刷新的最短工作方式:

$state.go($state.current, {}, {reload: true}); //second parameter is for $stateParams

Update for newer versions: 更新版本:

$state.reload();

Which is an alias for: 这是别名:

$state.transitionTo($state.current, $stateParams, { 
  reload: true, inherit: false, notify: true
});

Documentation: https://angular-ui.github.io/ui-router/site/#/api/ui.router.state.$state#methods_reload 文档: https//angular-ui.github.io/ui-router/site/#/api/ui.router.state.$state#methods_reload


#5楼

For angular v1.2.26, none of the above works. 对于角度v1.2.26,以上都不起作用。 An ng-click that calls the above methods will have to be clicked twice in order to make the state reload. 必须单击两次调用上述方法的ng-click才能重新加载状态。

So I ended up emulating 2 clicks using $timeout. 所以我最终使用$ timeout模拟了2次点击。

$provide.decorator('$state',
        ["$delegate", "$stateParams", '$timeout', function ($delegate, $stateParams, $timeout) {
            $delegate.forceReload = function () {
                var reload = function () {
                    $delegate.transitionTo($delegate.current, angular.copy($stateParams), {
                        reload: true,
                        inherit: true,
                        notify: true
                    })
                };
                reload();
                $timeout(reload, 100);
            };
            return $delegate;
        }]);

#6楼

for ionic framework 用于离子骨架

$state.transitionTo($state.current, $state.$current.params, { reload: true, inherit: true, notify: true });//reload

$stateProvider.
  state('home', {
    url: '/',
    cache: false, //required

https://github.com/angular-ui/ui-router/issues/582 https://github.com/angular-ui/ui-router/issues/582

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值