Angular ui-router verschachtelte Ansichten - Kein Inhalt erscheint

Question

Ich versuche, verschachtelte Ansichten für eine Seite mit eckigen ui-Router zu implementieren und haben die Zustandsdefinitionen für verschiedene Tutorials konfiguriert, kann aber keine Inhalte für angezeigt werden die untergeordneten Ansichten, obwohl keine Fehler in der Konsole vorhanden sind.

Ich versuche, die folgenden mit parent.child Punktnotation für die Zustands Namen:

.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

Sie brauchen nicht die neu zu definieren Gesamter Pfad zur URL-Eigenschaft, fügen Sie einfach den Zusatz hinzu.

In diesem Fall: url:'/mainDetails'