ネストされた状態はロードされません

Question

これまでネストされた状態を作ってみました。私はとsearchModelを使用する場合、私がこれまで持っているもの

この

search.route.jsある

angular.module('myApp') 
.config(function ($stateProvider, $urlRouterProvider) { 
    $urlRouterProvider.when('/search', '/search/model'); 

    $stateProvider 
     .state('search', { 
      abstract: true, 
      url: '/search' 
     }); 
}); 

model.route.js

angular.module('myApp') 
.config(function ($stateProvider, $urlRouterProvider) { 
    $stateProvider 
     .state('search.model', { 
      url: '/model', 
      templateUrl: 'app/search/model/model.html', 
      controller: 'modelController' 
     }); 
}); 

およびではなく、州の名前と/search/modelをURLとして使用しますそれは正常に動作します。

EDIT さて、私が最初に周り^^もともと

私のコードは次のように見えた時クリアされませんでした。

model.route.jsを

angular.module('myApp') 
.config(function ($stateProvider, $urlRouterProvider) { 
    $stateProvider 
     .state('searchModel', { 
      url: '/search/model', 
      templateUrl: 'app/search/model/model.html', 
      controller: 'modelController' 
     }); 
}); 

これはうまくいった。 /search/modelにアクセスしたら、コントローラと一緒にhtmlファイルがロードされます。

しかし、私は質問の最初に表示されているコードに変更しました。今すぐURLにナビゲートすると、コントローラと一緒にHTMLに読み込まれません。なぜ私はそれが読み込まれないのかという手がかりを与えるかもしれないエラーメッセージや同様のものを受け取ることはありません。

Answer 1

子状態がロードされるためには、抽象状態で<ui-view>が必要です。

試してみてください。

$stateProvider 
    .state('search', { 
     abstract: true, 
     url: '/search'. 
     template: '<ui-view></ui-view>' 
    }); 

Nested States docs