從angularjs隱藏父狀態視圖，最佳實踐？

Question

'update-approved-product-campaign-ad'當我通過ui-sref父狀態視圖調用子狀態時，這是'product-campaigns.product-campaign-detail'的子狀態與子狀態視圖一起被調用我不想要。我只想要孩子狀態視圖。

Answer 1

據我所知它不可能只加載子視圖。無論何時加載孩子的視圖，其父母的視圖也隨之加載。

Answer 2

這可以使用視圖定位完成。

假設你在根目錄下有一個未命名的ui-view。當孩子被激活時，它可以使用目標視圖接管父母的未命名視圖。子視圖可以直接把自己的內容放到父母的觀點：

var app = angular.module("plunker", ['ui.router']) 
app.config(function($stateProvider) { 
    $stateProvider.state('parent', { 
    url: "", 
    template: "<a ui-sref='.child'>Go to child</a><h1>Parent</h1>" 
    }).state('parent.child', { 
    url: '/child', 
    views: { 
     "@": { 
     template: "<a ui-sref='^'>Back to parent</a><h1>child</h1>" 
     } 
    } 
    }) 
}) 

，也可能與只是有一個嵌套的UI視圖，它又將目標

var app = angular.module("plunker", ['ui.router']) 
app.config(function($stateProvider) { 
    $stateProvider.state('parent', { 
    url: "", 
    template: "<a ui-sref='.child'>Go to child</a><h1>Parent</h1>" 
    }).state('parent.child', { 
    url: '/child', 
    views: { 
     "@": { 
     template: "<small>parent ui-view overridden by parent.child</small> <div ui-view='child'/>" 
     }, 
     "child@parent.child": { 
     template: "<a ui-sref='^'>Back to parent</a><h1>child</h1>" 
     } 
    } 
    }) 
}) 

模板替換父視圖

目標命名視圖是「viewname @ statename」。命名視圖「@」表示在（@）根狀態（「」）處定位名爲空字符串（「」）的視圖。

http://plnkr.co/edit/iff63xbNWCbK9MEPMb4f?p=preview

Answer 3

我通過包裝與<div ui-view="">

這父視圖將覆蓋ui-view與導航到一個孩子的狀態，當孩子解決這個問題，否則將包含專利狀態的看法。