góc nhà nước ui router - nhiều quốc gia với cùng một mẫu và điều khiển

Question

Tôi đã tiểu bang được xác định như sau trong ứng dụng angularjs tôi sử dụng nhà cung cấp nhà nước ui Router góc. Và, tôi muốn xác định nhiều trạng thái với cùng một cấu hình tức là. với cùng một mẫu và bộ điều khiển.

$stateProvider 
     .state('parent', { 
      templateUrl: 'parent.html', 
      abstract: true, 
      parent: 'apm' 
     }) 
     .state('parent.list', { 
      abstract: true, 
      url: '/list', 
      templateUrl: 'list.html', 
      controller: 'ListCtrl' 
     }) 

     .state('parent.list.closed', { 
     url: '/q', 
     templateUrl: 'closed.html' 
     }) 

     .state('parent.list.details', { // would like to have same template, controller on different state parent.details without list 
      url: '/:id/:name', 
      abstract: true, 
      templateUrl: 'details.html', 
      controller: 'DetailsCtrl', 
      resolve: { 
       ..... 
       ..... 
      } 
     }) 
     .state('parent.list.details.data', { // would like to have same template, controller on different state parent.details.data without list 
      url: '/details', 
      views : { 
      'view1' : { 
       templateUrl : 'view1.html' 
      }, 
      'view2' : { 
       templateUrl : 'view2.html', 
       controller : 'View2Ctrl' 
      }, 
      'view3' : { 
       templateUrl : 'view3.html' 
      }, 
      'view4' : { 
       templateUrl : 'view4.html' 
      } 
      } 
     }) 

Có thể làm điều gì đó như

.state(['parent.list.details', 'parent.details'], { 
      url: '/:id/:name', 
      abstract: true, 
      templateUrl: 'details.html', 
      controller: 'DetailsCtrl', 
      resolve: { 
       ..... 
       ..... 
      } 
     }) 

Bất kỳ sự giúp đỡ hoặc gợi ý?

Answer 1

Mỗi tiểu bang cần phải được xác định trong phương pháp .state() riêng của nó. Bạn sẽ gặp phải nhiều vấn đề khi cố gắng thực hiện theo cách bạn đã liệt kê ở trên. Quan trọng nhất sẽ là url.

Bạn chỉ có thể làm điều này:

.state('parent.list', { 
     url: '/list', 
     abstract: true, 
     templateUrl: 'details.html', 
     controller: 'DetailsCtrl', 
     resolve: { 
      ..... 
      ..... 
     } 
    .state('parent.list.details', { 
     url: '/:id/:name', 
     abstract: true, 
     templateUrl: 'details.html', 
     controller: 'DetailsCtrl', 
     resolve: { 
      ..... 
      ..... 
     } 
    }) 

Trong khi mã được chưa cô đặc hoặc hiệu quả theo nghĩa bạn phải khai báo bộ điều khiển và một phần được sử dụng trên mỗi tiểu bang, nó là cần thiết vì mỗi tiểu bang cần riêng của mình .state() phương pháp

Answer 2

tôi muốn giống nhau và làm cho nó như thế này:

//add a new Function to the object $stateProvider 
       $stateProvider.states = (statesArr, obj) => { 

        for (var i in statesArr) { 
         var state = statesArr[i]; 

         $stateProvider.state(state, obj); 
        } 

        return $stateProvider; 
       }; 


//use the new function 
       $stateProvider 

       .states(["main", "main.test"], { 
        url: '/main', 
        templateUrl: 'modules/ViewContainer.html', 
        controllerAs: 'currentCtrl', 
        controller: 'MainCtrl' 
       })