Angular Ui Router :same state with different url

My app has two states home.summary(parent state) and home.summary.detail(child state) and I want to show on same state with different url.

Is there a way to achieve this?From state of home.summary start with URL:/home/summary and then to /home/summary/detail/:id without changing state.

• AngularJS version:1.2.14
• Angular-ui-router version:0.2.7

routes.js looks like below mentioned:

.state('home', {
              abstract: true,            
              url: '/home',
              templateUrl: 'scripts/home.html'
       })
.state('home.summary', {
    url: '/summary?userId',                 
    views: {               
           'summary': 
              {
                        templateUrl: "scripts/home/summary.html"
              }
           }
    })
.state('home.summary.detail', {
    url: '/detail/:id',                 
    views: {               
           'detail': 
              {
                        templateUrl: "scripts/home/detail.html"
              }
           }
    })

My app has Angular-ui-bootstrap tabs and when switching between tabs need to change the url.

Summary Tab which is Static tab and has a state called home.summary and url is /home/summary.

Detail tab which is dynamic tab and has a state which is child of summary and url is /home/summary/detail/:id

Switching between tabs changes states using ui-sref and this causes memory leaks if I remove ui-sref I don't see any leaks.

I have noticed that $state.go re-initializes the controllers and scope variable in those controllers get updated and causes memory leaks.Is there a way to stop re-initializing the controllers on state change but change url??

or

have one state going to different url's??