ui-router nested states over two levels - angularjs

Question

I'm trying to nest states over two levels but i get the following error:
Error: Could not resolve 'purchases.inventory.create-move' from state 'purchases.inventory'
Here are the first and second level routes:
(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'
}
}
}
];
}
})();
Here are the third level routes (These aren't working):
(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'
}
}
}
];
}
})();
In the template what i do is:
<a ui-sref="pruchases.inventory.create-move">Create Move</a>
Is that ui-router doesn't support over two level nested routes?

Answer 1

I just mispelled the state name, here are the corrected states:
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'
}
}
}
];
}