Маршрутизатор Angular UI загружает только первое объявленное дочернее состояние

#javascript #angularjs #parent-child #angular-ui-router #nested-views

#javascript #angularjs #родитель-потомок #angular-ui-router #вложенные представления

Вопрос:

Загружается то дочернее состояние, которое я ставлю первым в своей настройке маршрутизации. Все остальное работает просто отлично. Разрешенные зависимости наследуются так, как должны, представление визуализируется и создается экземпляр контроллера. Но второе дочернее состояние полностью игнорируется…

Маршрутизация в app.coffee

 $stateProvider
.state 'feed',
  abstract: true
  url: '/'
  templateUrl: 'views/feed.html'
  controller: 'FeedController'
  resolve: (a bunch of them :P)
.state 'feed.timeline',
  url: ''
  views:
    'timeline':
      templateUrl: 'views/partials/feed/timeline.html'
      controller: 'FeedTimelineController'
.state 'feed.trending',
  url: ''
  views:
    'trending':
      templateUrl: 'views/partials/feed/trending.html'
      controller: 'FeedTrendingController'

заполнители в index.html:

 <div class="container">
  <div ui-view></div>
</div>

в ‘views/feed.html ‘:

 <div ui-view="trending"></div>
<div ui-view="timeline"></div>

Я действительно ценю любую помощь, перепробовал все, что мог придумать, и чувствую себя измотанным после нескольких часов поиска в вики, группах, Google, stackoverflow… Спасибо!

1. Вы пытались удалить свойство url в своих дочерних состояниях или сделать их разными? Например, / trending, / timeline

2. @rawphl это не было бы желаемым результатом, на самом деле это был просто случай дочернего состояния с двумя представлениями вместо двух отдельных дочерних состояний. Но большое спасибо за ваше время! Ценю это

3. Вам нужны URL-адреса в ваших дочерних состояниях. Обычно вы оставляете один из URL-адресов дочернего состояния пустым, если родительское состояние является абстрактным состоянием, таким образом, когда вы переходите к родительскому, по умолчанию для дочернего состояния используется пустой URL. Но да, похоже, вам, вероятно, нужны подвиды, а не отдельные дочерние состояния.

Ответ №1:

Я не уверен, что вы правильно понимаете ui-router. Состояние в основном соответствует URL (за исключением случаев, когда оно абстрактное). Я предполагаю, что вы хотите иметь одно состояние, которое помещает данные в два подвида вашего состояния ‘feed’.

 $stateProvider
.state 'feed',
  abstract: true
  url: '/'
  templateUrl: 'views/feed.html'
  controller: 'FeedController'
  resolve: (a bunch of them :P)
.state 'feed.index',
  url: ''
  views:
    'timeline@feed':
      templateUrl: 'views/partials/feed/timeline.html'
      controller: 'FeedTimelineController'
    'trending@feed':
      templateUrl: 'views/partials/feed/trending.html'
      controller: 'FeedTrendingController'

Вам не обязательно выбирать ‘feed.index’ в качестве имени, но оно должно начинаться с ‘feed.’, так что это дочернее состояние.