Angular UI-Router：在父视图中打开子状态

Question

我目前遇到以下问题：

我正在使用UI路由器创建一个Ionic / Angular / Phonegap应用程序，这很棒，只有一件事我还不清楚：

我有一个像这样的标签式应用程序：

<ion-tabs class="tabs-positive">

    <ion-tab class="tabs-icon-only" icon="ion-android-favorite-outline" ui-sref="main.outfit">
        <ion-nav-view name="outfit-tab"></ion-nav-view>
    </ion-tab>

    <ion-tab class="tabs-icon-only" icon="ion-bag" ui-sref="main.cart">
        <ion-nav-view name="cart-tab"></ion-nav-view>
    </ion-tab>

    <ion-tab class="tabs-icon-only" icon="ion-information-circled" ui-sref="main.contact">
        <ion-nav-view name="contact-tab"></ion-nav-view>
    </ion-tab>

    <ion-tab class="tabs-icon-only" icon="ion-person" ui-sref="main.user">
        <ion-nav-view name="user-tab"></ion-nav-view>
    </ion-tab>

</ion-tabs>

Contact页面有一个打开Reviews的按钮，需要在Contact页面中加载另一个页面，其中Contact为父级。需要说明的是：如果我导航到/ contact / reviews，它应该指示导航栏中的后退按钮，因为它有父Contact。

这是我的routes.js的一部分：

$stateProvider

.state("main", {
    url: "/main",
    abstract: true,
    templateUrl: 'views/main.html',
    defaultChild: 'main.outfit'
})

.state("main.outfit", { 
    url: "/outfit",
    cache: false,
    views: {
        'outfit-tab': {
            templateUrl: "views/outfit/outfit.html",
            controller: "OutfitIndexCtrl"
        }   
    },
    defaultChild: 'main.outfit.musthaves'
})

.state('main.outfit.basics', {
    url: "/basics",
    views: {
        'basics-tab': {
            templateUrl: "views/outfit/outfit.basics.html",
            controller: "OutfitBasicsCtrl"
        }   
    }
})

.state('main.outfit.musthaves', {
    url: "/musthaves",
    views: {
        'musthaves-tab': {
            templateUrl: "views/outfit/outfit.musthaves.html",
            controller: "OutfitMusthavesCtrl"
        }   
    }
})

.state('main.outfit.sale', {
    url: "/sale",
    views: {
        'sale-tab': {
            templateUrl: "views/outfit/outfit.sale.html",
            controller: "OutfitSaleCtrl"
        }   
    }
})

.state('main.contact', { 
    url: '/contact',
    views: {
        'contact-tab': { 
            templateUrl: "views/contact/contact.html",
            controller: "ContactCtrl"
        }   
    }
})

.state('main.contact.reviews', {
    url : '/reviews',
    views: {
        'contact-tab': { 
            templateUrl: "views/contact/review/review.html",
            controller: "ReviewCtrl"
        }   
    }
})

当我现在点击按钮时，没有任何反应..按钮的代码下方。

<a ui-sref="main.contact.reviews" class="review-button">
    Klantenbeoordeling
</a> 

我在这里做错了什么？