Handling nested views inside dialog

Question

We are using angular-ui-router for handling nested views in page level and it works fine. but we are not able to display nested views inside dialog. I searched in stackoverflow and not found useful things yet.

I have tried using ui-router as well with ui-roter-extras using sticky state

ui-router

Example 1

ui-router with ui-router-extras (sticky state)

Example 2

In the above samples, Check the following road map

Click "First Page" > Click "Popup Page" > Click "Child Page1" or "Child Page 2"

Child Pages not getting displayed. Anyone have an idea to fix this..or tell me other directions to achieve this?

Answer 1

Absolute named view (putting @ end of the name) is working fine. Please check the below link for more details.

https://github.com/christopherthielen/ui-router-extras/issues/125

  $stateProvider.state('first.popup.child1', {
    url: '/child1',
    views: {
      'child1View@': {
        templateUrl: 'child1.html'
      }
    }
  });


  $stateProvider.state('first.popup.child2', {
    url: '/child2',
    views: {
      'child2View@': {
        templateUrl: 'child2.html'
      }
    }
  });