nowe trasy ember.js: jak podłączyć punkty sprzedaży?

Question

Nie jestem pewien, jak podłączyć gniazda z nowym podejściem routera.

index.html:

... 
<script type="text/x-handlebars" data-template-name="application"> 
    <h4>The application handelbar</h4> 
    {{! outlet 1}} 
    {{outlet}} 
</script> 

<script type="text/x-handlebars" data-template-name="index"> 
    <h4>The index handelbar</h4> 
    {{! outlet 2 and 3}} 
    {{outlet nav}} 
    {{outlet main}} 
</script> 

<script type="text/x-handlebars" data-template-name="main"> 
    <h4>The main handelbar</h4> 
</script> 

<script type="text/x-handlebars" data-template-name="nav"> 
    <h4>The nav handelbar</h4> 
</script> 
... 

app.js:

... 
App.Router.map(function(match) { 
    this.resource("index", { path: "/" }); 
    this.route("test"); 
}); 

App.IndexController = Ember.Controller.extend({ 
}); 

App.IndexView = Ember.View.extend({ 
    templateName: 'index' 
}); 
... 

Kod ten powoduje wylot-1.

Pytania:

• Dlaczego wylot-1 renderowane? W jaki sposób połączone są outlet-1 i "index"?
• Jak mogę podłączyć gniazda 2 i 3 do tej samej strony "indeksu"?

Dzięki
MIW

Answer 1

musisz określić te rzeczy w obsługi trasy, stosując metodę renderTemplate (lub metodę renderTemplates, w zależności od swojej kompilacji).

To, czego nie widzisz, to to, że Ember ustawia już dla Ciebie kilka domyślnych ustawień domyślnych. W rzeczywistości ustawienia domyślne ustawione przez Ember pozwoliły na pominięcie całej procedury obsługi trasy.

App.Router.map(function(match) { 
    this.resource("index", { path: "/" }); 
    this.route("test"); 
}); 
App.IndexRoute = Ember.Route.extend({ 
    renderTemplate: function() { 
    this.render(); 
    /* this is the default, it will basically render the 
     default template, in this case 'index', into the 
     application template, into the main outlet (i.e. your 
     outlet 1), and set the controller to be IndexController. 
    */ 

    } 
}); 

Co chcesz jest świadczenie dodatkowych szablonów w funkcji renderTemplate, likeso:

renderTemplate: function() { 
    this.render("index"); 
    // this renders the index template into the primary unnamed outlet. 
    this.render("navtemplate", {outlet: "nav"}); 
    // this renders the navtemplate into the outlet named 'nav'. 
    this.render("main", {outlet: "main"}); 
    // this renders the main template into the outlet named 'main'. 
    } 

nadzieję, że to pomaga.

Answer 2

Ember automatycznie przyjmuje/dopasowuje z IndexRoute, IndexController i IndexView. Jest w ember routing guide

Aby połączyć zagnieżdżonych trasy można zrobić to tak:

App.OtherRoute = Ember.Route.extend({ 
    renderTemplate: function() { 
    this.render('otherTemplate', { 
     into: 'index', 
     outlet: 'nav' 
    }); 
    } 
}); 

Here jest bardziej dogłębne odpowiedzi z innym pytaniem.