UI-маршрутизатор, получающий доступ к родительскому состоянию от дочернего

Question

Я хотел бы установить заголовок на основе состояния в моем угловом приложении. Он работает хорошо, но если в дочернем состоянии нет названия, я хотел бы вернуться к свойству title родителя.

Это то, что я до сих пор:

В моем блоке приложение запуска:

... 
$rootScope.$on('$stateChangeSuccess', function (event, current, previous) { 

    if (current.hasOwnProperty('title')) { 
    $rootScope.title = current.title; 
    } 
}); 
... 

В пути моего модуля

.state('main.parent', { 
    url: '/parent', 
    controller: 'ParentController', 
    controllerAs: 'vm', 
    templateUrl: 'app/parent.html', 
    title: 'Parent', 
}) 
.state('main.parent.child', { 
    url: '/child', 
    controller: 'ChildController', 
    controllerAs: 'vm', 
    templateUrl: 'app/child.html' 
}) 

Во время проверки кода, я что $stateChangeSuccess запускается дважды, как ожидалось, сначала для родителя, а затем для ребенок. Я пытался получить доступ к current.parent, когда ребенок был вызван, но у него нет такого свойства. Есть ли способ получить к нему доступ?

UPDATE

Я видел эти вопросы: get parent state from ui-router $stateChangeStart, get parent state from ui-router $stateChangeStart Но ни один из них не имел четкого ответа на этот вопрос (за исключением государственного расщепления хака в последнем одном, но я предпочел бы избежать этого).

Answer 1

И в конце концов я придумал следующее решение:

Я хранить title внутри data объекта государства, потому что от $state вы не можете получить доступ к другим свойства родителя, только те, которые хранятся в data (что имеет смысл - не загрязнять определение состояния пользовательскими свойствами).

.state('main.parent', { 
    url: '/parent', 
    controller: 'ParentController', 
    controllerAs: 'vm', 
    templateUrl: 'app/parent.html', 
    data: { 
    title: 'Parent' 
    } 
}) 
.state('main.parent.child', { 
    url: '/child', 
    controller: 'ChildController', 
    controllerAs: 'vm', 
    templateUrl: 'app/child.html' 
}) 

И я изменил runblock следующим образом:

... 
$rootScope.$on('$stateChangeSuccess', function (event, toState, fromState) { 
    var current = $state.$current; 
    if (current.data.hasOwnProperty('title')) { 
    $rootScope.title = current.data.title; 
    } else if(current.parent && current.parent.data.hasOwnProperty('title')) { 
    $rootScope.title = current.parent.data.title; 
    } else { 
    $rootScope.title = null; 
    } 
}); 
... 

Это не идеальное решение все же, как и в случае нескольких вложенных состояний было бы хорошо, чтобы возвратиться к названию название самого молодого предка, но сейчас это делается.

Answer 2

В обоих случаях это хаки. Не забудьте импортировать в свой контроллер $ state (и $ stateParams для 2-го варианта). Вы можете использовать:

$state.$current.parent.self.title 

или

var tree = current.name.split('.'); 
tree.splice(tree.length-1, 1); 
var parent = tree.join('.'); 
$state.get(parent, $stateParams); 

Answer 3

кажется, что вам просто нужно title свойства падать обратно титул собственность родителя, если нет названия определяется на состоянии ребенка, я предложу вы должны использовать этот репозиторий: angular-ui-router-title.