2015-06-17 19 views
20

Amaç bağlayıcı ebeveyn yönlendirici viewport html modülleri oluşturmak için: Ben app önemli özelliği alanlarına göre güzergah organize etmek çocuk yönlendiricileri kullanan ayrılığı ve kapsülleme faydaları istiyorum. Ancak, ana yönlendirici görünüm portu tarafından işlenen ve oluşturulan bu yollara sahip olmak istiyorum. her şey geri (bir deneme olarak) rotayı temsilci ebeveyn yönlendiriciye çağrı yapmaya dahil denedi başarısız olması, bugüne kadaryapılandır çocuk yönlendirici

<div id="parentRouterViewport" data-bind="router: { cacheViews: true }"><div>

yani. Bunun mümkün olup olmadığını merak ediyorum.

Kısaltmalar için, yalnızca yönlendirme için görev kritik kod bölümlerini ekliyorum.

shell.js

return { 
     router: router, 
     activate: function() { 
      return router.map([ 
        { route: 'App*splat', moduleId: 'app/home/viewmodels/index', title: 'Home', nav: true } 
       ]).buildNavigationModel() 
       .mapUnknownRoutes('app/home/viewmodels/error') 
       .activate(); 
     } 
    }; 

shell.html

<div id="content" data-bind="router: { cacheViews: true }"></div> 

index.js (çocuk yönlendirme modülü)

var childRouter = router.createChildRouter() 
     .makeRelative({ 
      moduleId: 'app/home/viewmodels', 
      fromParent: true 
     }).map([ 
      { route: 'EligibiltySearch', moduleId: 'eligibilitySearch', title: 'Eligibility Search', nav: true } 
     ]).buildNavigationModel(); 

    return { 
     router: childRouter 
    }; 
}); 

Bu çalışmanın tek yolu, karşılık gelen index.html görünümüne bir yönlendirici görünüm portu yerleştirirsem gerçekleşir. Ancak, bu css düzeni ve sayfa bakmak ve tasarlamaya çalışıyorum hissediyorum dayalı sonra değilim. Her şey bir panel olarak temsil edilmeli ve bir rota vurulduğunda farklı bir panel için değiştirilmelidir. Şu anda, bu yaklaşım sürekli açık iki panel olacak. Ne demek istediğimin daha iyi bir bağlamı için aşağıdaki fotoğrafa bakınız. Ekibimizde

Photo of the CSS layout issue described above

+0

Buna benzer bir şeye ulaşmaya çalışıyorsunuz [Durandal Örnek] (http://dfiddle.github.io/dFiddle-2.0/#view-composition)? –

cevap

3

, biz kendi/göstermek için Nakavt değişkenleri kullanarak "çocuk yönlendiricileri" sekme düğmesi tıklama temelinde subviews gizlemek oluşturduk. Bununla ilgili bir uyarı, çalışmanın alt görüntüsünü almak için ana/ebeveyn görünümünden etkinleştirme, devre dışı bırakma, kompozisyonDepini, vb. Diğer bazı tuhaflıklar var, ama bunu bir seçenek olarak veya bu soruyu daha sonra gören başkaları olarak vereceğimi düşündüm.

İlgili konular