Angular ui-router-как получить доступ к параметрам во вложенном, именованном представлении, переданном из родительского шаблона?
Привет я пытаюсь получить доступ к параметру в контроллере "ViewWorklogCrtl" при использовании ui-router и работает с трудностями.
В основном, мой родительский шаблон содержит:
a(ui-sref="instance-ticket.worklog({id:{{ticket.testnum}}})") show
а затем дальше по странице:
section(ui-view="top-section")
затем в моем приложении.js, содержащий информацию о маршрутизации на стороне клиента вкратце у меня есть:
$stateProvider
.state('instance-ticket', {
url: '/ticket/:instanceID',
templateUrl: 'partials/instance-ticket',
controller: 'ViewTicketCrtl'
})
.state('instance-ticket.worklog', {
views:{
'top-section':{
templateUrl:'/partials/ticket.worklog.jade',
controller: 'ViewWorklogCrtl'
}
}
})
загрузка шаблона работает правильно, проблема и вопрос, на который я не могу найти ответ, - Как получить доступ "testnum" передается через ссылку ui-sref, в ViewWorkLogCtrl и внутри него... Есть ли лучший подход к этому?
спасибо!!!
2 ответов:
The
instanceIDобъявляется как параметр, поэтому мы можем получить к нему доступ следующим образом.controller('ViewWorklogCrtl', [ '$scope','$stateParams' function($scope , $stateParams ) { // $scope.instanceID = $stateParams.instanceID; ...все остальные подробности можно найти здесь https://github.com/angular-ui/ui-router/wiki/URL-Routing
и звонок в
ui-srefдолжно быть так<a ui-sref="instance-ticket.worklog({ instanceID:ticket.testnum })" >..Extend:
в случае, если мы хотели бы получить два параметра, 1) instanceID от родителя 2) testnum от текущего, мы должны настроить определение состояния, как это
.state('instance-ticket', { url: '/ticket/:instanceID', // instanceID templateUrl: 'partials/instance-ticket', controller: 'ViewTicketCrtl' }) .state('instance-ticket.worklog', { // new param defintion url: '/worklog/:testnum', // testnum views:{ 'top-section':{ templateUrl:'/partials/ticket.worklog.jade', controller: 'ViewWorklogCrtl' } }и
ui-sref<a ui-sref="instance-ticket.worklog({ instanceID:1, ticket.testnum:2 })" >..и мы можем получить к нему доступ следующим образом:
.controller('ViewWorklogCrtl', [ '$scope','$stateParams' function($scope , $stateParams ) { // console.log($stateParams.instanceID) console.log($stateParams.testnum) ...
Я написал пользовательскую директиву для решения этой проблемы.
<a my-sref="{{myStateVar}}">awesome link</a>вы можете клонировать его из Github: https://github.com/JensEger/Angular-Directives/tree/master/ui-router-helper
Comments