AngularJS de l'INTERFACE utilisateur du Routeur $état de rechargement état d'enfant seulement
Je suis à l'aide de l'INTERFACE utilisateur du routeur pour les onglets du menu principal ainsi que pour les liens à l'intérieur de l'un des états (les utilisateurs). Les utilisateurs d'etat a une liste d'utilisateurs et lorsqu'un utilisateur clique dessus, j'ai envie de le recharger à l'état d'enfant, mais elle se rechargeant à la fois l'état d'enfant et le parent de l'état (les utilisateurs).
Voici mon 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;
});
});
C'est la fonction dans mon contrôleur de parent (UserController) qui est appelée lorsque l'utilisateur clique sur:
this.userTreeClick = function(e) {
contextInfo.setUserKey(e.Key);
contextInfo.setUserName(e.Value);
userCtrl.userKey = e.Key;
$state.forceReload();
};
Donc dire que j'ai été chez les utilisateurs.les groupes d'utilisateurs de l'etat, lorsque je clique sur un autre utilisateur, je veux seulement les utilisateurs.les groupes d'utilisateurs de l'etat à être rechargé. Est-ce possible? J'ai cherché une réponse via Google et ici, à StackOverflow, mais je n'ai rien trouvé qui est exactement comme ce que je suis en train de faire. Quand je pause pour vérifier l' $état.$actuel.nom - le nom est correct - utilisateurs.les groupes d'utilisateurs, mais il recharge tout au lieu de simplement l'état d'enfant. Toute aide est grandement appréciée!
Vous devez vous connecter pour publier un commentaire.
Comme indiqué dans la Référence de l'API , on peut utiliser
$state.reload
:Un exemple:
Similaire, nous pouvons réaliser avec un
$state.go()
et sesoptions
paramètre:Exemple de https://github.com/angular-ui/ui-router/issues/1612#issuecomment-77757224 par Chris T:
Un exemple
L'interface utilisateur actuelle-routeur (0.2.14 et ci-dessus) ajout du support pour recharger état d'enfant.
Simplement mettre
$state.go('your_state', params, {reload: 'child.state'});
va faire le travail.Voir:
https://github.com/angular-ui/ui-router/issues/1612 et
https://github.com/angular-ui/ui-router/pull/1809/files
ui-sref-opts
par exemple:<a ui-sref="home" ui-sref-opts="{reload: 'home.child'}">Home</a>
J'ai eu à le faire fonctionner. J'ai utilisé ce que Radim suggéré, mais j'ai dû ajouter de la url élément à l'état.
et dans mon contrôleur, lorsqu'un utilisateur clickes sur un lien, j'utilise le
$state.transitionTo
:Juste un avis pour tout les autres débutants là-bas:
J'ai vu et appris quelques trucs assez intéressant d'essayer de débrouiller cette...
Ce sera tout simplement recharger seulement que l'état d'enfant comme vous le vouliez. pas l'ensemble de la hiérarchie de l'état.