2013-08-04 18 views
6

Więc mam stronę, która wygląda następującoEmber.js - domyślny szablon do renderowania do gniazdka?

[ Nav Bar ] 

|   | 
| Content | 
|   | 

The pasku nawigacyjnym Chcę być stała na wszystkich stronach. Zatem podejście Kiedyś było ustawić stronę w następujący sposób:

[ Nav Bar ] 

{{outlet}} 

To jest dobre, mogę teraz uczynić różnych stron do mojego gniazdka na różnych trasach.

Ale co zrobić, jeśli chcę, aby domyślny szablon został wyrenderowany do gniazdka na moją stronę główną?

udało mi się to osiągnąć poprzez przekierowanie / do /home, ale nie musi być lepszy sposób to zrobić, który pozwala mi uczynić domyślną stronę główną w / bez re-routing?

Wszelkie porady mile widziane,

Dzięki Daniel

Odpowiedz

7

Aby uczynić rzeczy w {{wylot}} na stronie root /, trzeba zdefiniować skrypt handlerbar dla indeksu:

Kod navbar prawdopodobnie wyglądać tak:

<script type="text/x-handlebars"> 
    <div class="navbar ..."> 
    ... 
    </div> 

    {{outlet}} 
</script> 

The strona korzeń, który będzie miejscem wewnątrz {{}} wylot jest odłogowania:

<script type="text/x-handlebars" id="index"> 
    <div class="container"> 
     <h1>Root page!!</h1> 
    </div> 
</script> 

innymi słowy, trzeba utworzyć skrypt, który będzie miał kierownicy id = „index”.

Powinien działać. Nie potrzebuje żadnego kodu js do pracy.

+1

Dzięki za odpowiedź. Niestety, mam już szablon "indeksu" - to szablon, który zawiera pasek nawigacji i gniazdko ... – bluepnume

+0

Następnie powinieneś tylko przesunąć pasek nawigacyjny wewnątrz kierownicy, który nie ma żadnego id lub szablonu danych -Nazwa. Sprawdź to: http://jsfiddle.net/jorat1346/8tvRj/1/ Masz treść na stronie głównej, dlaczego ten model nie zadziałał. – darkzangel

+0

Prawo - moja trudność z tym, co sugerujesz, mam model, którego potrzebowałem do zapełnienia paska nawigacyjnego, ale ponieważ router nie wydaje się być wywoływany dla aplikacji (tylko "indeks"), nie miałem gdzie zapełnić mojego modelu. Myślę jednak, że mogę obejść ten problem, tworząc MyApp.ApplicationController i zapełniając mój model w init(). Dzięki za radę, wypróbuję niektóre z tego. – bluepnume

1

Muszę przyznać tej nieruchomości nie jest dobrze udokumentowany i zakopane w docs dla Ember.View ale można spróbować ustawić właściwość defaultTemplate na ApplicationView. Aby uzyskać więcej informacji na ten temat, patrz here (wyszukaj na stronie "defaultTemplate").

Mam nadzieję, że to pomaga.

+0

Dzięki za sugestię. Skończyło się na tym, że otrzymałem powyższą odpowiedź, ale było to również pomocne. – bluepnume

0

Poniższe oświadczenie w docs pomógł mi rozwiązać dokładnie ten sam problem miałem mający która jest zawarta w pytaniu: Ember routing docs

Szablon indeks będą renderowane w {{gniazdka}} w szablon aplikacji. Jeśli użytkownik przejdzie do/ulubionych, Ember zastąpi szablon indeksu szablonem ulubionych.

Ponieważ używam struktury strąk w moim projekcie, utworzyłem trasę indeksu mającą mój domyślny szablon i umieściłem składnik paska nawigacyjnego w pliku application/template.hbs.

app/aplikacja/template.hbs:

<div id="pageWrapper"> 
    <div id="navbarfixed">{{nav-bar options=options}}</div> 
    <div id="pageContent"> 
     {{outlet}} 
    </div> 
</div> 

app/index/szablon.hbs

<div id="homeWrapper"> <!--This gets rendered by default in outlet above--> 
Some default content of outlet 
</div> 
Powiązane problemy