我正在使用UI路由器作为主菜单的选项卡以及其中一个状态(用户)中的链接。用户状态有用户列表,当用户点击时,我想重新加载子状态,但是它正在重新加载子状态和父状态(用户)。
这是我的代码:
app.config(function ($stateProvider,$locationProvider,$urlRouterProvider) { $urlRouterProvider.otherwise("/"); $locationProvider.html5Mode(true); $stateProvider .state('home',{ abstract: true,template: '<div ui-view=""></div>',controller: 'HomeController as homeCtrl' }) .state('users',{ parent: 'home',url: '/users',templateUrl: '/User/Index',controller: 'UserController as userCtrl',}) .state('users.createUser',{ templateUrl: '/User/CreateUser',controller: 'CreateUserController as cuCtrl' }) .state('users.editUser',{ templateUrl: '/User/EditUser',controller: 'EditUserController as euCtrl',resolve: { userInfo: function (contextInfo,userData) { return userData.get(contextInfo.getUserKey()); } } }) .state('users.addWebItemsForUser',{ templateUrl: '/User/AddWebItemsForUser',controller: 'UserWebItemsController as uwiCtrl' }) .state('users.addReportsForUser',{ templateUrl: '/User/AddReportsForUser',controller: 'UserReportsController as urCtrl' }) .state('users.userGroups',{ templateUrl: '/User/UserGroups',controller: 'UserGroupController as userGroupCtrl' }) //.state('users.logInWebApp',{ // template: '<h3>Logging into web app</h3>',// resolve: { // user: function() { // return { // //companyId: contextInfo.getCustomerKey() // //userId: // //password: // } // } // },// controller: function() { // // need company code,username and password of user then need to open window with webapp url (will that work?) - do we still want to add this functionality? // } //}) .state('links',{ url: '/links',templateUrl: '/Link/Index',controller: 'LinkController as linkCtrl' }) .state('onlrpts',{ url: '/onlineReports',templateUrl: '/OnlineReport/Index',controller: 'OnlineReportController as onlRptCtrl' }) .state('reports',{ url: '/customerReports',templateUrl: '/CustomerReport/Index',controller: 'CustomerReportController as custRptCtrl' }); }) .config(function($provide) { $provide.decorator('$state',function($delegate,$stateParams) { $delegate.forceReload = function() { return $delegate.go($delegate.$current.name,$stateParams,{ reload: true,inherit: false,notify: true }); }; return $delegate; }); });
这是在我的父控制器(UserController)中,当用户被点击时调用的函数:
this.userTreeClick = function(e) { contextInfo.setUserKey(e.Key); contextInfo.setUserName(e.Value); userCtrl.userKey = e.Key; $state.forceReload(); };
所以说我在users.userGroups状态,当我点击另一个用户,我只想要users.userGroups状态被重新加载。这可能吗?我已经通过谷歌和StackOverflow找到了一个答案,但我没有发现任何与我正在尝试的东西完全一样。当我断开检查$状态$ current.name – 名称是正确的 – users.userGroups,但它重新加载所有,而不仅仅是子状态。任何帮助非常感谢!
如API Reference所述,我们可以使用$ state.reload:
原文链接:https://www.f2er.com/angularjs/144780.html07000
A method that force reloads the current state. All resolves are
re-resolved,controllers reinstantiated,and events re-fired.Parameters:
state
(optional)
- A state name or a state object,which is the root of the resolves to be re-resolved.
一个例子:
//will reload 'contact.detail' and 'contact.detail.item' states $state.reload('contact.detail');
类似的,我们可以用$ state.go()和它的options参数来实现:
07001
…
options
(optional)
location
…inherit
…relative
…notify
…reload
(v0.2.5) – {boolean=false|string|object},If true will force transition even if no state or params have changed. It will
reload the resolves and views of the current state and parent states.
If reload is a string (or state object),the state object is fetched (by name,or object reference); and \ the transition reloads the
resolves and views for that matched state,and all its children
states.
例如https://github.com/angular-ui/ui-router/issues/1612#issuecomment-77757224 by Chris T:
{ reload: true } // reloads all,{ reload: 'foo.bar' } // reloads top.bar,and any children { reload: stateObj } // reloads state found in stateObj,and any children
一个例子
$state.go('contact',{...},{reload: 'contact.detail'});