角度ui視圖嵌套路由

Question

我在我的應用程序中有一個嵌套的ui路由。索引頁（根頁面）工作，但不是嵌套頁面。

這裏是我的app.js

var app = angular.module('app', ['ui.router']) 
.config(function($stateProvider, $urlRouterProvider, $locationProvider) { 
    $locationProvider.html5Mode(true); 
    $stateProvider 
     .state('index', 
     { 
      url: '/index', 
      templateUrl: 'index.html' 
     }) 
     .state("index.salesorder", 
     { 
      url: '/salesorder', 
      views: { 
       'mainlayout': { 
        templateUrl: 'partials/salesorder.html' 

       } 
      } 

     }); 
}); 

在我的index.html，我有一個用戶界面視圖屬性的DIV

<div ui-view="mainlayout"> </div> 

我還添加了必要的腳本的角度，和UI的路線。我在控制檯中沒有任何錯誤。但銷售訂單不顯示。儘管我看到了索引。

Answer 1

你的第二個狀態index.salesorder是index的子狀態。你有沒有正確的嵌套ui視圖？看起來你可能需要3個級別的UI視圖。

試試這個：

var app = angular.module('app', ['ui.router']) 
 
.config(function($stateProvider, $urlRouterProvider, $locationProvider) { 
 
    $locationProvider.html5Mode(true); 
 
    $stateProvider 
 
     .state("salesorder", 
 
     { 
 
      url: '/salesorder', 
 
      views: { 
 
       'mainlayout': { 
 
        templateUrl: 'partials/salesorder.html' 
 

 
       } 
 
      } 
 

 
     }); 
 
});

main.html中：

<div ui-view></div> 

salesorder.html：

<div ui-view="mainlayout"></div>