Is my use of parent-child controller using states correct?

I have this in my app.js

.state('tab.events', {
            url: "/events",
            views: {
                'tab-events': {
                    templateUrl: "templates/events/List.html",
                    controller: 'EventsListController'
                }
            }
        })

        .state('tab.events.details', {
            url: "/:eventId",
            views: {
                'tab-events': {
                    templateUrl: "templates/events/Details.html",
                    controller: 'EventDetailsController'
                }
            }
        })

This is List.html

...
                <ion-list>
                    <ion-item ng-repeat="event in all_events.models" type="item-text-wrap" ui-sref="tab.events-details({eventId:event.id})" class="item item-icon-right">
                    {{event.name}}
                    </ion-item>
                </ion-list>
...

This is Details.html

<ion-view title="Event">
    <ion-content>    
        <div class="row">
            <div class="col">
                DETAILS HERE
            </div>
        </div>
    </ion-content>
</ion-view>

This is my tabs.html 

...
<ion-tab title="Events" icon="icon ion-calendar"  id="tab-events" ui-sref="tab.events">
                        <ion-nav-view name="tab-events" class="slide-left-right"></ion-nav-view>
                    </ion-tab>
...

When clicking on an event, it doesnt slide to Details.html, Yet when i change the state and ui-sref from tab.events.details to tab.events-details and it works. Am i right in saying that by changing the details state that it is no longer a child of list?

It's an old question, but have you tried to change tab-friends to tab-friends@tab?

.state('tab.friends.detail', {
  url: '/:friendId',
  views: {
    'tab-friends@tab': {
      templateUrl: 'friend-detail.html',
      controller: 'FriendDetailCtrl'
    }
  }
})

Should work. My problem though is that when you jump directly to this URL there is no Back-Button.