2014-02-14 8 views
1

Мне нужна информация о {{link-to}} на ember. Я сделал некоторые испытания, и есть то, что я действительно не понимаю ..Динамическая ссылка Ember.js

Пример:

У меня есть блог с различной пост вроде этого:

App.Router.map(function() { 
    this.resource('login', { path: '/' }); 
    this.resource('home'); 
    this.resource('posts', function(){ 
     this.resource('post', { path: '/:post_id' }, function(){ 
      this.route('update'); 
     }); 
    this.route('create'); 
    }); 
}); 

Допустим, что я есть этот шаблон:

<script type="text/x-handlebars" data-template-name="enquiries"> 
    <table> 
     <thead> 
      <tr> 
       <th>id</th> 
       <th>type</th> 
       <th>name</th> 
       <th>last update</th> 
       <th>Detail</th> 
      </tr> 
     </thead> 
     <tbody> 
     {{#each post in model}} 
      <tr> 
       <td>{{post.id}}</td> 
       <td>{{post.type}}</td> 
       <td>{{post.name}}</td> 
       <td>{{post.updatedAt}}</td> 
       <td>{{#link-to 'post' post}}View{{/link-to}}</td> 
      </tr> 
     {{/each}} 
     </tbody> 
    </table> 
</script> 

Мой простой пост шаблон

<script type="text/x-handlebars" data-template-name="post"> 
    <div class="post-info"> 
     <button {{action "update"}}>Update</button> 
     <table> 
      <tr> 
       <td>{{title}}</td> 
      </tr> 
      <tr> 
       <td>{{content}}</td> 
      </tr> 
      <tr> 
       <td>{{author}}</td> 
      </tr> 
     </table> 
    </div> 
</script> 

Те ссылки динамичный и есть на всех них хороший URL, такие как LOCALHOST/сообщений/1 или 2 и т.д. ...

Когда я нажимаю на ссылку, ничего не случилось. Я должен был {{oulet}} показать это. но моя проблема заключается в том, что его показ на той же странице, что и моя таблица (внизу), но я хотел только отобразить шаблон сообщения.

У меня есть некоторые проблемы, чтобы понять, почему, а также в чем главная цель выход в моем случае ...

Спасибо.

ответ

2

Причина: post указан в шаблоне posts, так как ваш Router определяет его таким образом. Если вы хотите отдельную страницу, попробуйте следующее:

App.Router.map(function() { 
    this.resource('login', { path: '/' }); 
    this.resource('home'); 
    this.resource('posts'); 
    this.resource('post', { path: 'posts/:post_id' }, function(){ 
     this.route('update'); 
    }); 
    this.route('create'); 
}); 

Если у вас есть вложенный ресурс, то {{outlet}} помощник обозначает где вложенная шаблон будет оказана.

+0

Спасибо !!! это было очень полезно! :) – SuperMarco

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