AngularJS - Dinámico $ StateProvider
-
20-12-2019 - |
Pregunta
Estoy intentando ansiosamente crear un Dyanmic $ StateProvider:
Standard Static $ StateProvider:
$stateProvider
.state('main',
{
url: '/',
templateUrl: '/views/main.html',
controller: 'MainCtrl'
})
.state('login',
{
templateUrl: '/views/login-form.html',
controller: 'LoginCtrl'
})
.state('logout',
{
controller: 'LogoutCtrl'
})
.state('sales', {
templateUrl: '/views/sales-data.html',
controller: 'SalesDataCtrl',
resolve: {
user: 'User',
authenticationRequired: function(user) {
user.isAuthenticated();
}
}
});
dinámico $ StateProvider:
var verify = function(user) { user.isAuthenticated(); };
var states= [
{ name: 'main', url: '/', templateUrl: '/views/main.html', controller: 'MainCtrl' },
{ name: 'login', url: '', templateUrl: '/views/login-form.html', controller: 'LoginCtrl' },
{ name: 'logout', url: '', templateUrl: '', controller: 'LogoutCtrl' },
{
name: 'sales',
url: '',
templateUrl: '/views/sales-data.html',
controller: 'SalesDataCtrl',
//resolve:
//[
// { user: 'User', authenticationRequired: 'verify();' }
//]
}
];
// w/o the array brackets in resolve the navigation does not work.
// with the array brackets, once sales is clicked I get:
// Error: [ng:areq] Argument 'fn' is not a function, got Object
Los dos métodos a continuación funcionan, siempre y cuando no utilice la resolución:
This works:
angular.forEach(states, function(state) {
$stateProvider.state(state);
});
This works:
angular.forEach(states, function(state) {
$stateProvider.state(state.name, state);
});
Pregunta: ¿Cómo puedo hacer que este trabajo dinámico $ StateProvider funcione con la resolución?
Solución
Solución:
var states = [
{ name: 'main', url: '/', templateUrl: '/views/main.html', controller: 'MainCtrl' },
{ name: 'login', url: '', templateUrl: '/views/login-form.html', controller: 'LoginCtrl' },
{ name: 'logout', url: '', templateUrl: '', controller: 'LogoutCtrl' },
{
name: 'sales',
url: '',
templateUrl: '/views/sales-data.html',
controller: 'SalesDataCtrl',
resolve: {
user: 'User',
authenticationRequired:
['user', function(user) { user.isAuthenticated(); }] // <-------------------------
}
}
];
angular.forEach(states, function (state) {
$stateProvider.state(state.name, state);
});
Otros consejos
Creo que está llamando incorrectamente $stateProvider.state(...)
, toma una identificación de estado y luego el objeto de configuración.
Suponiendo que las propiedades de su generación de generación son válidas y únicas, debe poder hacer esto (o ajústelo según sea necesario):
angular.forEach(states, function(state) {
$stateProvider.state(state.name, state);
});
Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow