只有AngularJS UI路由器$状态重装子状态

编程入门行业动态更新时间:2024-10-23 23:34:28

本文介绍了只有AngularJS UI路由器$状态重装子状态的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！问题描述

我使用的UI路由器为各州（用户）中的一个内链接主菜单，以及标签。用户州有一个用户列表，并单击用户时，我想只有重装孩子的状态，但它无论重装子状态和父状态（用户）。

I am using UI router for tabs of a main menu as well as for links within one of the states (users). The users state has a list of users and when a user is clicked, I want to reload the child state only, but it is reloading both the child state and the parent state (users).

下面是我的code：

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 is the function in my parent controller (UserController) that is called when a user is clicked:

this.userTreeClick = function(e) { contextInfo.setUserKey(e.Key); contextInfo.setUserName(e.Value); userCtrl.userKey = e.Key; $state.forceReload(); };

所以说，我是在users.userGroups状态，当我点击其他用户，我想只有users.userGroups状态重新加载。这可能吗？我已经看过在计算器通过谷歌和这里的答案，但我没有发现任何东西，这正是像什么，我试图做的。当我打破了检查$ $状态current.name - 名字是正确的 - users.userGroups，但一切都重新加载，而不是仅仅子状态。任何帮助是非常AP preciated！

So say I was in the users.userGroups state, when I click on another user, I want only the users.userGroups state to be reloaded. Is this possible? I have looked for an answer via Google and here at StackOverflow, but I haven't found anything that is exactly like what I am trying to do. When I break to check the $state.$current.name - the name is correct - users.userGroups, but it reloads everything instead of just the child state. Any help is very much appreciated!

推荐答案

本机，内置的 UI路由器的功能是：

The native, built-in functionality of ui-router is:

的形成一个孩子状态到另一个状态子的父是永远不会重新加载

除非我们明确地将改变这种内置的行为，例如通过装饰像你一样，迫使重装与传递这些选项：

unless we will explicitly change that built in behaviour, e.g. via decorator as you did and force the reload with passing these options:

{重载：真的，继承：假的，通知：真正}

{ reload: true, inherit: false,notify: true }

解决方法：不要强迫的重新加载 - 而不是用一些参数为每一个孩子的（如的groupId ）的

Solution: do not force reload - instead use some Parameter for each child (e.g. groupId)

.state('users.userGroups', { templateUrl: '/User/UserGroups/:groupId', // here is the groupId param defined controller: 'UserGroupController as userGroupCtrl' })

然后，如果导航到不同的组 - 不同的参数：的groupId将触发重载只是状态

Then, if navigating to a different group - the different parameter :groupId will trigger reload just of that state.

一个方法甚至可以是过往一些虚拟的参数，其值为null或...的String.Empty这样的URL没有改变。我试图表明，在这里：

One way could even be the passing some dummy param, which has value null or string.empty... so the url is not changing. I tried to show that here: