Angular UI-Router передача данных между состояниями с функцией go не работает
Я только начал изучать angularjs, и я использую angular -ui-router. Я пытаюсь отправить данные из одного состояния в другое с помощью $state.go
, но у меня нет успеха. Вот что я до сих пор:
Я не включил html намеренно, потому что предположил, что он не нужен, если это необходимо, скажите мне, и я добавлю его.
Я сконфигурировал свои состояния, как показано ниже:
$stateProvider
.state('public', {
abstract: true,
templateUrl: 'App/scripts/main/views/PublicContentParent.html'
})
.state('public.login', {
url: '/login',
templateUrl: 'App/scripts/login/views/login.html',
controller: 'loginCtrl'
})
$stateProvider
.state('private', {
abstract: true,
templateUrl: 'App/scripts/main/views/PrivateContentParent.html'
})
.state('private.visits', {
url: '/visits',
views: {
'main': {
controller: 'visitsListCtrl',
templateUrl: 'App/scripts/visits/views/VisitsList.html'
}
}
});
Когда мой LoginController
вызывается, он выполнит следующий код:
loginModule.controller('loginCtrl', ['$state', function ($scope, $state) {
$state.go('private.visits', { name : "Object"});
}]);
Когда активна страница private.visits
, я пытаюсь распечатать $stateParams
:
visitsModule.controller('visitsListCtrl', ['$stateParams',
function ($stateParams) {
console.log($stateParams);
}]);
Как вещи state $stateParams - пустой объект. Я ожидал, что он должен содержать объект, который я передал в loginCtrl.
ИЗМЕНИТЬ
Кажется, что если private.visits
url имеет этот формат url '/visits/:name'
, и я также добавляю параметры свойства: [ "name" ] Я получаю доступ к объекту, который я отправляю из состояния public.login
.
Побочным эффектом является то, что параметры добавляются к URL-адресу, который является логическим.
Я попытался сделать то же самое с дочерним состоянием без url, и в этом случае кажется, что у меня нет доступа к параметрам, которые я передал из public.login
.
Как отправить данные в дочерние состояния?
Ответы
Ответ 1
Что вам нужно сделать, так это определить параметр name
в состоянии private.visits
, например:
$stateProvider
.state('public', {
abstract: true,
templateUrl: 'App/scripts/main/views/PublicContentParent.html'
})
.state('public.login', {
url: '/login',
templateUrl: 'App/scripts/login/views/login.html',
controller: 'loginCtrl'
})
$stateProvider
.state('private', {
abstract: true,
templateUrl: 'App/scripts/main/views/PrivateContentParent.html'
})
.state('private.visits', {
// NOTE!
// Previously, we were only passing params as an array
// now we are sending it as an object. If you
// send this as an array it will throw an error
// stating id.match is not a function, so we updated
// this code. For further explanation please visit this
// url http://stackoverflow.com/a/26204095/1132354
params: {'name': null},
url: '/visits',
views: {
'main': {
controller: 'visitsListCtrl',
templateUrl: 'App/scripts/visits/views/VisitsList.html',
resolve: {
name: ['$stateParams', function($stateParams) {
return $stateParams.name;
}]
}
}
}
});
И затем в диспетчере доступа к имени:
visitsModule.controller('visitsListCtrl', ['name',
function (name) {
console.log(name);
}]);
Надеюсь, это поможет вам!
Ответ 2
Когда вы говорите: $state.go('private.visits', { name : "Object"});
Вы не передаете данные в состояние private.visits
, но вы устанавливаете параметр в состояние private.visits
, который даже не поддерживает параметры, поскольку вы не определили параметры для него в конфигурации состояния, Если вы хотите обмениваться данными между состояниями, используя службу, или если ваши состояния имеют отношения родитель-потомок, тогда дочернее состояние будет иметь доступ к данным родительских состояний. Учитывая, как вы не хотите, чтобы данные зависали в ваших URL-адресах, я бы использовал сервис (getters/setters) для достижения этого.