Doubly-nested Views In Ui Router

Playing around with angular-ui and specifically using the ui-router module to do some nested views. I'm having trouble getting a partial to render within a partial: The nesting is

Solution 1:

The view nesting, inside of one state, is done via their relative/absolute view name (not via object nesting)

Let's say, that the templateUrl contains the ui-view="slider", then we have to target that view name absolutely

$stateProvider
   .state('main', {
     url: '/',
     views: {
      'sidebar': {
         templateUrl: 'views/partials/main.sidebar.html',
       },
      // this view definition is on the same level// but the absolute name says, that it should be searched// inside of the 'main' state'slider@main': {
         templateUrl: 'views/partials/sidebar.slider.html'
      },
      ...

the key here is the name of the view 'slider@main', which contains from view name 'slider' delimiter '@' and the state name 'main'. Check these for more details:

• Combining nested and multiple views for a single state
• View Names - Relative vs. Absolute Names