Контроллер на вложенном состоянии не выполняется.

Question

У меня есть вложенные состояния с родительским и дочерним состоянием, имеющим отдельный контроллер. Но выполняется только родительское состояние.

Я имею структуру URL: #/ресторан/2/наши пищевую

Итак, я хочу, чтобы загрузить ресторан с ID 2, а затем нагрузкой контроллера дочернего элемента «наша еда» содержанием и позаботьтесь о некоторых других функциях.

Мой код:

var app = angular.module("app", ['ui.router']); 
app.config(function ($stateProvider, $urlRouterProvider) { 
$urlRouterProvider.otherwise("/"); 

$stateProvider 
      .state('home', { 
       url: '/', 
       controller: function($scope, $stateParams) { 
         $scope.setRestaurant(0); 
       } 
      }) 
      .state('restaurant', { 
       url: '/restaurant/:restaurantId', 
       controller: function($scope, $stateParams, $state) { 
        console.log('first'); 
        if($stateParams.restaurantId > 0) { 
         $scope.setRestaurant($stateParams.restaurantId); 
        } 
        else { 
         $state.go('home'); 
        } 
       } 
      }) 
    .state('restaurant.our-food', { 
     url: '/our-food', 
     templateUrl: 'templates/our-food.html', 
        controller: function() { 
         console.log('second'); 
        } 
    }); 

});

Answer 1

Контроллер для вашего состояния «restaurant.our-food» не выполняется, поскольку его родительское состояние не имеет шаблона. Это означает, что нет директивы ui-view, чтобы она могла прикрепить свой собственный шаблон и контроллер. Даже если ваша родительская директива не делает ничего, кроме настройки какого-либо состояния, она должна обеспечить как минимум минимальный шаблон.

Попробуйте добавить следующие строки в состояние «ресторан» и посмотрите, что делает его работу для вас:

template: "<div ui-view />" 

Это отражено в пользовательском интерфейсе маршрутизаторами документы:

Запомнить : Абстрактные состояния все еще нуждаются в их собственных для их детей, чтобы подключиться. Поэтому, если вы используете абстрактное состояние только для , добавьте URL-адрес, установите разрешающую способность/данные или запустите функцию onEnter/Exit, , тогда вам также необходимо будет установить шаблон: < ui-view/> '.

https://github.com/angular-ui/ui-router/wiki/Nested-States-%26-Nested-Views