2014-02-12 2 views
1

Я пытаюсь создать простейшее приложение, где на странице индекса у вас есть панель навигации и просто сообщение «привет». Затем вы можете щелкнуть на пользователях или организациях, и они соответственно изменятся.Ember.js Вложенные маршруты и шаблоны не работают

routes.js

App.Router.map(function() { 
    this.resource('index', { path : '/' }, function() { 
    this.route('users', { path : '/users'}); 
    this.route('org', { path : '/org'}); 
    }); 
}) 

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

App.IndexUsersRoute = Ember.Route.extend({ 
    model: function() { 
    return EmberFire.Array.create({ 
     ref: new Firebase(FirebaseRef + 'users') 
    }); 
    }, 
    renderTemplate: function() { 
    this.render('index'); 
    this.render('nav', { 
     outlet: 'nav', 
     into : 'index' 
    }); 
    this.render('users', { 
     outlet: 'users', 
     into : 'index' 
    }); 
    } 
}); 

App.IndexOrgRoute = Ember.Route.extend({ 
    model: function() { 
    return EmberFire.Array.create({ 
     ref: new Firebase(FirebaseRef + 'organizations') 
    }) 
    }, 
    renderTemplate: function() { 
    this.render('index'); 
    this.render('nav', { 
     outlet: 'nav', 
     into : 'index' 
    }); 
    this.render('org', { 
     outlet: 'org', 
     into : 'index' 
    }); 
    } 
}); 

И index.html

<!-- Nav --> 
    <script type='text/x-handlebars' data-template-name='nav'> 
    <nav> 
     ........... 
    </nav> 
    </script> 
    <!-- End Nav --> 

    <!-- Index --> 
    <script type='text/x-handlebars' data-template-name='index'> 
    {{outlet nav}} 

    <section id='userDisplay'> 
     <div class="row"> 
     {{outlet users}} 
     </div> 
    </section> 

    <section id='orgDisplay'> 
     <div class="row"> 
     {{outlet org}} 
     </div> 
    </section> 
    </script> 

    <!-- Users --> 
    <script type='text/x-handlebars' data-template-name='users'> 
    <section id='registerForm'> 
     <h3>Register A User:</h3> 
     ....... 
    </section> 
    </script> 

    <!-- Orgs --> 
    <script type='text/x-handlebars' data-template-name='org'> 
    <section id='registerForm'> 
     <h3>Register An Organization:</h3> 
     ....... 
    </section> 
    </script> 

В настоящее время раздел Nav делает правильно в каждом маршруте, но я ничего не получаю от users или orgs шаблонов.

Что я оставляю, чтобы правильно отобразить эти шаблоны?

ответ

Смежные вопросы