爲什麼這個嵌套的餘燼路線的出口不顯示？

這裏有兩條路線，分別是A部分和B部分.B部分有一個嵌套路線，稱爲分部B。爲什麼這個嵌套的餘燼路線的出口不顯示？

當您單擊「轉到款B」

它應該顯示 B部分 ==> SUB B部分

但沒有任何反應。部分A內容仍然存在。在RouteManager中的日誌記錄表明它正在轉換，但是出口不會被更新。怎麼了？

這裏的小提琴：

和下面我粘貼應用代碼。

<script type="text/javascript"> 
    App = Ember.Application.create({ 
    ready: function() { 
     App.initialize(); 
    } 
    }); 

    App.ApplicationController = Ember.ObjectController.extend(); 
    App.ApplicationView = Ember.View.extend({ 
     templateName: "application_view" 
    }); 

    App.SectionAController = Ember.ArrayController.extend(); 
    App.SectionAView = Ember.View.extend({ 
    templateName: "section_a_view" 
    }); 

    App.SectionBController = Ember.ObjectController.extend(); 
    App.SectionBView = Ember.View.extend({ 
    templateName: "section_b_view" 
    }); 

    App.SubSectionB = Ember.ArrayController.extend(); 
    App.SubSectionBView = Ember.View.extend({ 
    templateName: "sub_section_b_view" 
    }) 

    App.Router = Ember.Router.extend({ 

    enableLogging: true, 

    root: Ember.Route.extend({   

     doSectionA : function(router, event) { console.log('blah'); router.transitionTo('sectionA.index'); }, 
     doSubSectionB : function(router, event) { router.transitionTo('sectionB.subSectionB.index'); }, 

     index: Ember.Route.extend({ 
      route: '/', 
      redirectsTo: "sectionA.index" 
     }), 

     sectionA: Ember.Route.extend({ 
     route: '/sectionA', 
     index: Ember.Route.extend({ 
      route: '/', 
      connectOutlets: function(router, context) { 
      router.get('applicationController').connectOutlet('sectionA'); 
      } 
     }) 
     }), 

     sectionB: Ember.Route.extend({ 
     route: '/sectionB', 
     index: Ember.Route.extend({ 
      route: '/', 
      connectOutlets: function(router, context) { 
      router.get('applicationController').connectOutlet('sectionB'); 
      } 
     }), 
     subSectionB: Ember.Route.extend({ 
      route: '/subSectionB', 
      index: Ember.Route.extend({ 
       route: '/', 
       connectOutlets: function(router, context) { 
       router.get('sectionBController').connectOutlet('subSectionB'); 
       } 
      }) 
     }) 

     }) 

    }) 
    }) 
</script> 
</head> 
<body> 

    <script type="text/x-handlebars" data-template-name="application_view"> 
    <a href="#" {{action "doSectionA"}}>go to section A</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="#" {{action "doSubSectionB"}}>go to subsection B</a> 
    <div class="container"> 
     {{outlet}} 
    </div> 
    </script> 
    <script type="text/x-handlebars" data-template-name="section_a_view"> 
    SECTION A 
    </script> 
    <script type="text/x-handlebars" data-template-name="section_b_view"> 
    SECTION B 
    {{outlet}} 
    </script> 
    <script type="text/x-handlebars" data-template-name="sub_section_b_view"> 
    this is sub section B 
    </script> 


</body>

來源

2012-07-13 inconduit

看看日誌路由器的，當你點擊「去款B」：

STATEMANAGER: Sending event 'doSubSectionB' to state root. 
STATEMANAGER: Entering root.sectionB 
STATEMANAGER: Entering root.sectionB.subSectionB 
STATEMANAGER: Entering root.sectionB.subSectionB.index

路由器從來沒有穿過root.sectionB.index它加載了sectionB（其中又包括模板subSectionB的出口）。因此，你需要確保通過將其放置到root.sectionB路線，對於sectionB模板被加載：

小提琴：http://jsfiddle.net/ppanagi/hSpHK/4/

sectionB: Ember.Route.extend({ 
    route: '/sectionB', 
    connectOutlets: function(router, context) { 
     router.get('applicationController').connectOutlet('sectionB'); 
    },  

    index: Ember.Route.extend({ 
     route: '/',   
    }), 

    // ... 
})

來源

2012-07-13 18:07:01

非常感謝你，我只是學習路由器現在做不知道如何正確讀取路由日誌。 – inconduit 2012-07-13 18:35:28

爲什麼這個嵌套的餘燼路線的出口不顯示？

回答

相關問題