Ember.js路由器：嵌入式資源

Question

我正在創建一個Ember應用程序來顯示Twitter提要，但我無法通過嵌入式資源顯示單個推文。

的代碼如下：

模板

<script type="text/x-handlebars" data-template-name="tweets"> 
     <div id="stream"> 
      {{#each tweet in controller}} 
       <div class="tweet"> 
        <p class="tweet_text">{{tweet.text}}</p> 
        <p> {{#linkTo "tweet" tweet}} {{tweet.id}} {{/linkTo}}</p> 
       </div> 
      {{/each}} 
     </div> 
    </script> 

    <script type="text/x-handlebars" data-template-name="tweet"> 
     <div id="detail"> 
      {{text}} 
     </div> 
    </script> 

路由器

window.App = Ember.Application.create({ 
    LOG_TRANSITIONS: true 
}); 

App.Router.map(function(){ 
    this.resource('tweets',function(){ 
     this.resource('tweet',{path: ':tweet_id'}) 
    }); 
}); 

// (1) App.Router.map(function(){ 
//  this.resource('tweets') 
//  this.resource('tweet',{path: ':tweet_id'}) 
//  }); 



App.IndexRoute = Ember.Route.extend({ 
    redirect: function() { 
    this.transitionTo('tweets'); 
    } 
}); 

App.TweetsRoute = Ember.Route.extend({ 
    model: function(){ 
    var me = []; 
    $.getJSON("http://search.twitter.com/search.json?q=emberjs&rpp=200&count=200&callback=?", 
     {}, 
     function (data) { 
     $.each(data.results,function(k,tweet){ 
      var tweet = App.Tweet.create({ 
       created_at: tweet.created_at, 
       from_user: tweet.from_user, 
       profile_image_url: tweet.profile_image_url, 
       text: tweet.text, 
       id: tweet.id 
      }); 
      me.pushObject(tweet); 
     }); 
    }); 
    return me; 
    } 
}); 

對象&控制器

App.TweetsController = Ember.ArrayController.extend({}); 

App.Tweet = Ember.Object.extend({ 
    created_at: "", 
    from_user: "", 
    profile_image_url: "", 
    text: "", 
    id: 0 
}) 

正如你所看到的，我有一個評論我們的路由器（1），它可以找到正確的推文，並將其呈現在推文模板中。不過，我希望將這條路線嵌套起來，以便我可以將其作爲主 - 細節應用程序來實現。

使用LOG_TRANSITIONS，我可以看到正確的路由被初始化，但我無法獲取要呈現的嵌套資源路徑。

任何想法將非常感激，在此先感謝。

Answer 1

我得到了這個工作。對於任何類似的人，我都這樣做了：

模板 - 將{{#linkTo}}「tweet」...更改爲{{#linkTo}}「tweets.tweet」... AND加入{{出口}}

<script type="text/x-handlebars" data-template-name="tweets"> 
    <div id="stream"> 
     {{#each tweet in controller}} 
      <div class="tweet"> 
       <p class="tweet_text">{{tweet.text}}</p> 
       <p> {{#linkTo "tweets.tweet" tweet}} {{tweet.id}} {{/linkTo}}</p> 
      </div> 
     {{/each}} 
    </div> 
    {{ outlet }} 
</script> 

路由器 - 改變 'this.resource' 到 'this.route'

App.Router.map(function(){ 
    this.resource('tweets',function(){ 
     this.route('tweet',{path: ':tweet_id'}) 
    }); 
}); 

買者

我認爲這是一種變通方法，並且嵌套資源在這方面是正確的方法。我知道嵌套路線應該是「動詞」或動作路線。如果有人知道這個問題的正確方法，我仍然會很感激，但希望上面的內容能幫助其他相關的人。