CODEWITHSUNDEEP
javascriptangularjsparent-childangular-ui-routernested-views
gugiserman
gugiserman

Reputation: 25

Angular UI Router only loads first declared child state

Whichever child state I place first in my routing setup is the one that loads. Everything else works just fine. Resolve dependencies are inherited as they should, the view is rendered and controller instanciated. But the second child state is totally ignored...

Routing in 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'

placeholders in index.html:

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

in 'views/feed.html':

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

I really appreciate any help, tried everything I could think of and feeling exhausted after hours searching wikis, groups, google, stackoverflow... Thanks!

Upvotes: 1

Views: 1448

Answers (1)

FrontierPsychiatrist
FrontierPsychiatrist

Reputation: 1433

I'm not sure you understand the ui-router correctly. A state basically corresponds to a URL (except when it is abstract). I guess you want to have one state that puts stuff into the two subviews of your state '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'

You don't have to choose 'feed.index' as the name but it has to start with 'feed.' so it is a child state.

Upvotes: 1

Related Questions