2014-11-19 7 views
0

При использовании ui-view в AngularJS я пытаюсь использовать параметры URL внутри вложенных представлений.Угловой маршрутизатор AngularJS с различными URL-параметрами

Для объектов определенного типа я хочу иметь возможность отображать все сущности при навигации по url/entity, но я также хотел бы видеть только сущности заданного типа, если я перейду к объектам/ofcategory/CategoryName. Наконец, я также хочу, чтобы можно было перейти к/entities/details/entityName, чтобы увидеть детали одного объекта.

Возможно ли это,

Это мой UI-routercode:

app.config(['$stateProvider', function ($stateProvider) { 
$stateProvider 
     .state('entities', { 
      url: '/entities', 
      templateUrl: 'app/entities/views/entities.html' 

     }) 
     .state('entities.ofcategory', { 
      url: '/ofcategory/:categoryName', 
      templateUrl: 'app/entities/views/entities.ofcategory.html'   
     } 
     .state('entities.details', { 
      url: '/details/:entityName', 
      templateUrl: 'app/entities/views/entities.details.html'   
     }); 
}]); 

Если я навигации к субъектам/ofcategory/aname или/лица/подробности/aname вхожу контроллер регулярные Entities вместо категории или detailsController

ответ

1

Одним из вариантов является добавление абстрактного состояния, которое служит родителем для всех ваших объектов. В этом случае все ваши URL-адреса становятся родственниками в этом состоянии. Обратите внимание, что в шаблоне абстрактного состояния вы должны определить ui-view, чтобы его можно было использовать для загрузки дочерних шаблонов.

app.config(['$stateProvider', function ($stateProvider) { 
$stateProvider 
     .state('entities', { 
      url: '/entities', 
      abstract: true, 
      templateUrl: 'app/entities/views/entities.html' 
     }) 
     .state('entities.all', { 
      url: '/', 
      templateUrl: 'app/entities/views/entities.all.html' 
     }) 
     .state('entities.ofcategory', { 
      url: '/:categoryName', 
      templateUrl: 'app/entities/views/entities.ofcategory.html'   
     } 
     .state('entities.details', { 
      url: '/details/:entityName', 
      templateUrl: 'app/entities/views/entities.details.html'   
     }); 
}]); 

приложение/лица/просмотров/entities.html:

<div> 
    <h1>Entities<h1> 
    <div ui-view></div> 
</div> 
Смежные вопросы