ネストされた状態のコントローラは実行されません

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ではありません。あなたの親ディレクティブが何らかの状態をセットアップする以外に何もしない場合でも、少なくとも最小限のテンプレートを提供する必要があります。

てみてください、あなたの「レストラン」状態に次の、それはそれはあなたのために働くことができた場合に参照追加：これはUI-ルータのドキュメントに記載されて

template: "<div ui-view />" 

：

を忘れないでください：抽象的な州では、子どもがプラグインするために独自のものが必要です。したがって、 のURLを前に置くか、resolves/dataを設定するか、onEnter/Exit関数 を実行するだけの場合は、さらにテンプレート：<ui-view/> 'を設定する必要があります。仕事をしてくれた

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