通過狀態在頁面加載時加載模板 - AngularJS

Question

在我的應用程序中，我想要在加載索引頁面時加載嵌套視圖list-patents.htm。

我的主要導航是在我的index.htm上，有兩個導航項目transactions和patents。

如果您要點擊patents，還需要加載兩個子菜單項：list patents和add patents。在這裏，您可以導航到list-patents.htm，我想充當登陸視圖。

我已經嘗試了兩種方法：

• $urlRouterProvider.otherwise("");我不能去上班。

• 此方法（在我的腳本中）加載了嵌套視圖，但未能加載其父視圖的導航菜單。

  .state("index", { url: "", templateUrl: "templates/list-patents.htm", })

我想保持導航在其自己的觀點，因爲我沒有看到創建重複的代碼點。

任何想法如何在頁面加載，它加載patent-nav.htm和它的嵌套視圖list-patents.htm？任何幫助將不勝感激

---

app.js

var app = angular.module('myApp', ['ngRoute', 'angularMoment', 'ui.router']); 


app.config(['$stateProvider', '$locationProvider', '$urlRouterProvider', function($stateProvider, $locationProvider, $urlRouterProvider) { 

    $stateProvider 
    .state("index", 
    { 
     url: "", 
     templateUrl: "templates/list-patents.htm", 
    }) 
    .state("patents", { 
     url: "/patents", 
     templateUrl: "templates/patent-nav.htm", 
     controller: "patentCtrl" 
    }) 
    .state("patents.list", { 
     url: "/list-patents", 
     templateUrl: "templates/list-patents.htm", 
     controller: "patentCtrl" 
    }) 
    .state("patents.add", { 
     url: "/add-patents", 
     templateUrl: "templates/add-patent.htm", 
     controller: "patentCtrl" 
    }) 

查看

指數

<main class="container"> 
    <nav> 
     <ul> 
      <a ui-sref="patents">Patents</a> 
      <a ui-sref="transactions">Transactions</a> 
     </ul> 
    </nav> 
    <section ui-view> 

    </section> 
</main> 

專利導航

<nav> 
    <ul> 
     <li><a ui-sref="patents.list">List patents</a></li> 
     <li><a ui-sref="patents.add">Add patent</a></li> 
    </ul> 
</nav> 

<div ui-view></div> 

列表專利

<div> 
//just a load of content 
</div> 

Answer 1

做這個

$urlRouterProvider 
        .when('', '/parents/list-patents') 
        .when('/', '/parents/list-patents') 
        .otherwise('/parents/list-patents');