Ember中排序表的路由和控制器

我正在开发的应用程序包括用户模型，用户有分数。我试图创建一个“排行榜”页面，根据他们的分数对用户进行排名。我预计成千上万的使用应用程序的人，所以我想的排名是可见的方式有三种：Ember中排序表的路由和控制器

一个100强认为，简单地列出前100个用户。
A 你查看，列出你上面的10人，然后你，然后你下面的10人。
A 朋友查看显示你和你的朋友。

我不确定什么“最好”的方式去了解这是在Ember。到目前为止，我的尝试似乎是重复了很多代码和/或将事情放在错误的地方。这里是我的代码：

路线：

App.Router.map(function() { 
    this.resource('leaderboard', function() { 
    this.route('you', { path: '/' }); 
    this.route('friends'); 
    this.route('top'); 
    }); 
}); 

App.LeaderboardYouRoute = Ember.Route.extend({ 
    model: function() { 
    var users = App.store.find(App.User); 
    // TODO: sort users by descending score 
    // TODO: filter out users with an index too far from the user's 
    return users; 
    } 
}); 

App.LeaderboardFriendsRoute = Ember.Route.extend({ 
    model: function() { 
    var users = App.store.find(App.User); 
    // TODO: sort users by descending score and filter out non-friends 
    return users; 
    } 
}); 

App.LeaderboardTopRoute = Ember.Route.extend({ 
    model: function() { 
    var users = App.store.find(App.User); 
    // TODO: sort users by descending score and take the top 100 
    return users; 
    } 
});

leaderboard.handlebars：

<section id="leaderboard"> 
    <nav> 
    <ul> 
     <li>{{#linkTo "leaderboard.you"}}You{{/linkTo}}</li> 
     <li>{{#linkTo "leaderboard.friends"}}Friends{{/linkTo}}</li> 
     <li>{{#linkTo "leaderboard.top"}}Top 100{{/linkTo}}</li> 
    </ul> 
    </nav> 
    {{ outlet }} 
</section>

leaderboard_top.handlebars，leaderboard_you.handlebars，leaderboard_friends.handlebars：

{{#each user in model}} 
    <li data-user-id=""> 
    <span class="score">{{ user.score }}</span> 
    <div class="photo"></div> 
    <span class="name">{{ user.name }}</span> 
    <div class="clearboth"></div> 
    </li> 
{{/each}}

这似乎是多余的给我有三个不同的模板具有完全相同的代码。同样，我将不得不编写大量基本上说“按降序对用户进行排序”的代码。有一个更好的方法吗？

来源

2013-02-13 NudeCanalTroll

难道你不会对所有三条路线使用相同的视图（并因此使用相同的模板）吗？ – pjmorse 2013-02-13 19:28:31

我将如何去使用相同的视图？我觉得{{outlet}}助手会根据点击链接自动被LeaderboardTopView，LeaderboardYouView或LeaderboardFriendsView取代。因此，我提出了三种不同的看法。 – NudeCanalTroll 2013-02-13 19:52:06

@phammer下面有它。 – pjmorse 2013-02-14 01:05:30

您可以轻松地将不同的控制器/视图使用相同的模板。可以在视图中定义使用哪个模板。例如：

ExampleView = Ember.View.extend({ 
    templateName : "theSameTemplateAgainAndAgain" 
});

心连心，PH

更新

由于这个答案的前两个意见指出，该解决方案仍可能如果意见不被使用任何改善。定义要在Route上直接呈现的模板，如下所示。

App.ExampleRoute = Ember.Route.extend({ 
    renderTemplate: function() { 
    this.render('theSameTemplateAgainAndAgain'); 
    } 
});

来源

2013-02-13 19:57:56

所以在这种情况下，我会保留我的三个单独的视图文件（LeaderboardTopView，LeaderboardYouView和LeaderboardFriendsView），但只是让他们都指向相同的模板？ – NudeCanalTroll 2013-02-13 20:02:04

是的，你的权利。更好地在路线上直接定义它，在一分钟内看到我的更新答案。 – 2013-02-13 21:06:28

Ember中排序表的路由和控制器

回答

相关问题