角度ui路由器嵌套視圖-不顯示任何內容

Question

我正在嘗試使用角度ui-router為頁面實現嵌套視圖，並配置了與各種教程匹配的狀態定義，但是盡管控制台中沒有錯誤，但無法獲得任何內容顯示給子視圖。

我正在嘗試使用狀態名稱的parent.child點表示法進行以下操作：

.state('employees/employeeDetails', {
        url: '/employees/employeeDetails/:id',
        templateUrl: 'pages/employees/employeeDetails/employeeDetails.html',
        controller: 'employeeDetailsController',
        resolve: {
            lazyLoad: function($ocLazyLoad) {
                return $ocLazyLoad.load('js/controllers/employees/employeeDetails/employeeDetailsController.js');
            }
        }
    })

    .state('employees/employeeDetails.mainDetailsTab', {
        url: '/employees/employeeDetails/:id/mainDetails',
        templateUrl: 'pages/employees/employeeDetails/mainDetailsTab.html',
        controller: 'mainDetailsTabController',
        resolve: {
            lazyLoad: function($ocLazyLoad) {
                return $ocLazyLoad.load('js/controllers/employees/employeeDetails/mainDetailsTabController.js');
            }
        }
    })

--

HTML：

<div id="mainContent" data-simplebar>

  <div ui-view="mainDetailsTab" id="mainTab" class="tabContent carousel-item employeeDetailsTab"></div>

  <div ui-view="paymentsTab" id="paymentsTab" class="tabContent carousel-item employeeDetailsTab"></div>

  etc...

Answer 1

您無需重新定義url屬性的整個路徑，只需添加其他內容即可。

在這種情況下： url:'/mainDetails'