Трехуровневые вложенные маршруты в angular-ui-router

Я пытаюсь заставить мой вложенный маршрут работать, но мне уже два дня тяжело :(

один уровень работает нормально

два уровня работают нормально

три уровня не работает!

кто-нибудь может мне помочь?

заранее спасибо

angular.module('settings', []).config(['$stateProvider', '$routeProvider', '$urlRouterProvider', function($stateProvider, $routeProvider, $urlRouterProvider) {
    $stateProvider
        .state('settings', {
            url: '/settings',
           template:"Settings",
            controller: function(){
                console.log('settings');
            }
        }).
        state('settings.branch', {
            url: '/{branchId:[0-9]{1,8}}',
            template:"Branch",
            controller: function(){
                console.log('branch');
            }
        }).
        state('settings.branch.prop', {
            url: '/prop',
            template:"Property",
            controller: function(){
                console.log('property');
            }
        });
}]);

'/настройки' работают

'/настройки/1234' работает

'/settings/1234/prop' не работает, всегда возвращайте состояние prevues 'Branch'


angularjs angular-ui
person Abod    schedule 29.05.2013    source источник
comment
у вас есть jsfiddle/plunker?   -  person Ven    schedule 29.05.2013
comment
+1 за потребность в скрипке/плункере. Где находится зависимость от uirouter? var myapp = angular.module('myapp', [ui.router])?????   -  person scalaGirl    schedule 31.12.2013

Ответы (4)


arrow_upward
13
arrow_downward

Я думаю, вы не объявили представление пользовательского интерфейса в шаблоне Branch.

person Florian F    schedule 29.05.2013

arrow_upward
1
arrow_downward

Я была такая же проблема. Для settings.branch.prop попробуйте установить url на:

url: '/{branchId:[0-9]{1,8}}/prop'
person piotr.d    schedule 18.07.2013

arrow_upward
0
arrow_downward

У НАС возникла аналогичная проблема. Только что нашел решение (не очень красивая мысль)

Итак, у нас есть

/b2c/applicationShow --> applicationShowController (b2c.applicationShow) with an /:id 

/b2c/applicationShow/9238490392084/details --> detailsController (b2c.applicationShow.details) 

/b2c/applicationShow/9238490392084/details/someApp --> someAppController (b2c.applicationShow.details.someApp) 

/b2c/applicationShow/9238490392084/details/someApp/someTab --> this has no controller, only declare the previous one as parent.

Итак, как мы перешли из /b2c/applicationShow в /b2c/applicationShow/9238490392084/details/someApp/someTab (есть таблица, в которой перечислены все приложения, и щелкнув ссылку, вы, вероятно, попадете на эту конкретную вкладку)

Мы отправляем их по одному.

$state.go(b2c.applicationShow , {id: 9238490392084})

Затем в деталяхКонтроллер

$state.go(b2c.applicationShow.details.someApp);

Затем в someAppController

$stage.go(b2c.applicationShow.details.someApp, {tab: someTab});

По сути, конечный автомат выберет последний путь, добавит, а затем продолжит. Ну, как я уже сказал, это было некрасиво, но работа была сделана. Надеюсь, поможет.

person Joel Chu    schedule 21.10.2014

arrow_upward
0
arrow_downward

Попробуйте обернуть div с атрибутом ui-view вокруг содержимого ветки, например, так:

 <div ui-view> 
     branch content goes here .....
     ......

 </div>

сделал трюк для меня!

person Edwin O.    schedule 03.12.2016