UI路由器嵌套状态水平

Question

我试图巢州两个级别，但我得到了以下错误：

Error: Could not resolve 'purchases.inventory.create-move' from state 'purchases.inventory'

这里是第一级和第二级路线：

(function() { 
    'use strict'; 

    angular.module('app.purchases') 

     // Collect the ui-route states 
     .constant('states', getRouteStates()) 

     // Configure the ui-route states and state resolvers 
     .config([ '$stateProvider', '$urlRouterProvider', 'states', stateConfigurator ]); 

    function stateConfigurator($stateProvider, $urlRouterProvider, states) { 

     states.forEach(function (state) { 

      $stateProvider.state(state.name, state.config); 

     }); 

     $urlRouterProvider.otherwise("/"); 

    } 

    // Define the ui-route states 
    function getRouteStates() { 
     return [ 
      { 
       name: 'purchases', 
       config: { 
        url: '/compras', 
        views: { 
         'content-body': { 
          templateUrl: './modules/purchases/purchases-dashboard.view.html', 
          controller: 'PurchasesDashboardController', 
          controllerAs: 'vm' 
         } 
        }, 
        ncyBreadcrumb: { 
         label: 'Compras' 
        } 
       } 
      }, 
      { 
       name: 'purchases.inventory', 
       config: { 
        url: '/movimientos', 
        views: { 
         'panel-body': { 
          templateUrl: './modules/purchases/inventory/inventory-dashboard-options.view.html', 
          controller: 'InventoryDashboardController', 
          controllerAs: 'vm' 
         } 
        }, 
        ncyBreadcrumb: { 
         label: 'Inventario' 
        } 
       } 
      }, 
      { 
       name: 'purchases.products', 
       config: { 
        url: '/productos', 
        views: { 
         'panel-body': { 
          templateUrl: './modules/purchases/products/products-dashboard-options.view.html', 
          controller: 'ProductsDashboardController', 
          controllerAs: 'vm' 
         } 
        }, 
        ncyBreadcrumb: { 
         label: 'Productos' 
        } 
       } 
      }, 
      { 
       name: 'purchases.suppliers', 
       config: { 
        url: '/proveedores', 
        views: { 
         'content-body': { 
          templateUrl: './modules/purchases/suppliers/suppliers-dashboard-options.view.html', 
          controller: 'SuppliersDashboardController', 
          controllerAs: 'vm' 
         } 
        }, 
        ncyBreadcrumb: { 
         label: 'Proveedores' 
        } 
       } 
      } 
     ]; 
    } 

})(); 

下面是第三层路由（这些不工作）：

(function() { 
    'use strict'; 

    angular.module('app.purchases.inventory') 

     // Collect the ui-route states 
     .constant('states', getRouteStates()) 

     // Configure the ui-route states and state resolvers 
     .config([ '$stateProvider', '$urlRouterProvider', 'states', stateConfigurator ]); 

    function stateConfigurator($stateProvider, $urlRouterProvider, states) { 

     states.forEach(function (state) { 

      $stateProvider.state(state.name, state.config); 

     }); 

     $urlRouterProvider.otherwise('/'); 

    } 

    // Define the ui-route states 
    function getRouteStates() { 
     return [ 
      { 
       name: 'pruchases.inventory.create-move', 
       config: { 
        url: '/nuevo-movimiento', 
        views: { 
         'panel-body@': { 
          templateUrl: './modules/purchases/inventory/create-move/create-move.view.html', 
          controller: 'CreateMoveController', 
          controllerAs: 'vm' 
         } 
        }, 
        ncyBreadcrumb: { 
         label: 'Nuevo Movimiento' 
        } 
       } 
      }, 
      { 
       name: 'pruchases.inventory.list-moves', 
       config: { 
        url: '/movimientos', 
        views: { 
         'panel-body@': { 
          templateUrl: './modules/purchases/inventory/read-moves/list-moves.view.html', 
          controller: 'ReadMovesController', 
          controllerAs: 'vm' 
         } 
        }, 
        ncyBreadcrumb: { 
         label: 'Lista de Movimientos' 
        } 
       } 
      }, 
      { 
       name: 'pruchases.inventory.detail-move', 
       config: { 
        url: '/movimientos/:move_id/:move_date', 
        views: { 
         'panel-body@': { 
          templateUrl: './modules/purchases/inventory/read-moves/detail-move.view.html', 
          controller: 'ReadMovesController', 
          controllerAs: 'vm' 
         } 
        }, 
        ncyBreadcrumb: { 
         label: 'Detalle' 
        } 
       } 
      }, 
      { 
       name: 'pruchases.inventory.update-move', 
       config: { 
        url: '/movimientos/:move_id/:move_date/actualizar', 
        views: { 
         'panel-body@': { 
          templateUrl: './modules/purchases/inventory/update-move/update-move.view.html', 
          controller: 'UpdateMoveController', 
          controllerAs: 'vm' 
         } 
        }, 
        ncyBreadcrumb: { 
         label: 'Actualizacion' 
        } 
       } 
      } 
     ]; 
    } 

})(); 

在模板我要做的就是：

<a ui-sref="pruchases.inventory.create-move">Create Move</a> 

是ui路由器不支持两级嵌套路由吗？

Answer 1

我只是拼写错误的国家名称，这里被修正的状态：

function getRouteStates() { 
     return [ 
      { 
       name: 'purchases.inventory.create-move', 
       config: { 
        url: '/nuevo-movimiento', 
        views: { 
         'panel-body@': { 
          templateUrl: './modules/purchases/inventory/create-move/create-move.view.html', 
          controller: 'CreateMoveController', 
          controllerAs: 'vm' 
         } 
        }, 
        ncyBreadcrumb: { 
         label: 'Nuevo Movimiento' 
        } 
       } 
      }, 
      { 
       name: 'purchases.inventory.list-moves', 
       config: { 
        url: '/movimientos', 
        views: { 
         'panel-body@': { 
          templateUrl: './modules/purchases/inventory/read-moves/list-moves.view.html', 
          controller: 'ReadMovesController', 
          controllerAs: 'vm' 
         } 
        }, 
        ncyBreadcrumb: { 
         label: 'Lista de Movimientos' 
        } 
       } 
      }, 
      { 
       name: 'purchases.inventory.detail-move', 
       config: { 
        url: '/movimientos/:move_id/:move_date', 
        views: { 
         'panel-body@': { 
          templateUrl: './modules/purchases/inventory/read-moves/detail-move.view.html', 
          controller: 'ReadMovesController', 
          controllerAs: 'vm' 
         } 
        }, 
        ncyBreadcrumb: { 
         label: 'Detalle' 
        } 
       } 
      }, 
      { 
       name: 'purchases.inventory.update-move', 
       config: { 
        url: '/movimientos/:move_id/:move_date/actualizar', 
        views: { 
         'panel-body@': { 
          templateUrl: './modules/purchases/inventory/update-move/update-move.view.html', 
          controller: 'UpdateMoveController', 
          controllerAs: 'vm' 
         } 
        }, 
        ncyBreadcrumb: { 
         label: 'Actualizacion' 
        } 
       } 
      } 
     ]; 
    }