Route im Modal funktioniert nicht angularjs

Question

Ich habe ein Problem mit meiner Route in modal, ich kann meine erste Route ("/",menu.html) abrufen, aber wenn ich die Tasten drücke, erscheinen die anderen Routen nicht.

Das ist mein Weg:

angular.module('ui.bootstrap.demo').config(function($stateProvider, $urlRouterProvider){  
    $stateProvider 
     .state("foo", { 
      url: "/foo", 
      template: '<h1>foo</h1>' 
     }) 
     .state("menu", { 
      url: "/", 
      templateUrl: 'menu.html' 
     }) 
     .state("bar", { 
      url: "/bar", 
      template: '<h1>bar</h1>' 
     }) 

    $urlRouterProvider.otherwise("/"); 
}); 

Das ist mein modal mit div Ansicht ist:

<div class="modal-header"> 
    <h3 class="modal-title" id="modal-title">I'm a modal!</h3> 
</div> 
<div class="modal-body" id="modal-body"> 
    <div class="row"> 
     <div class="span12 ui-view-container"> 
      <div class="well" ui-view></div>   
     </div> 
    </div>  
</div> 
<div class="modal-footer"> 
    <button class="btn btn-primary" type="button" ng-click="$ctrl.ok()">OK</button> 
    <button class="btn btn-warning" type="button" ng-click="$ctrl.cancel()">Cancel</button> 
</div> 

Und das ist mein menu.html:

<div class="navbar"> 
    <div class="navbar-inner"> 
     <a class="brand" href="#">Quick Start</a> 
     <ul class="nav"> 
      <li><a href="#/foo">Route 1</a></li> 
      <li><a href="#/bar">Route 2</a></li> 
     </ul> 
    </div> 
</div> 

ich einen simple plunker gemacht mit ein Modal.

Answer 1

Der Anbieter des Bundesstaats hat ui-sref, um die Route zu bearbeiten, die den Namen des Staates zur Navigation übernimmt.

<ul class="nav"> 
    <li><a ui-sref="foo">Route 1</a></li> 
    <li><a ui-sref="bar">Route 2</a></li> 
</ul> 

aktualisieren

Wenn Sie das modale öffnen, um es zu einem Standardzustand 'Menü' durchlaufen $state.go('menu'). Damit dies funktioniert, injiziert $ Zustand in der Steuerung als Gebrüll:

angular.module('ui.bootstrap.demo').controller('ModalDemoCtrl', 
function ($uibModal, $log, $document, $state) { 
...... 

    $ctrl.open = function (size, parentSelector) { 
    $state.go('menu'); 
    ...... 
    } 
}); 

Plunker mit Kommentaren Abfrage aktualisiert.