如何在集合中添加集合？

Question

問題：我正在使用backbone.js我有一個玩家的player視圖，該視圖的根元素是一個<li></li>列表項節點。

然後我有一個players視圖，顯示集合中的所有玩家，這個視圖的根元素是一個<ul></ul>。 （很簡單的東西！）

這樣做的結果是。

<ul> //The players collection root for the players collection view 
    <li>Kobe Bryant is on the lakers</li> // The player model root element for the player model view 
    <li>LeBron James is on the heat</li> // The player model root element for the player model view 
</ul> 

我的模特的屬性包括name, team。

[ 
    {name: 'Kobe Bryant', team: 'lakers'}, 
    {name: 'LeBron James', team: 'heat'} 
] 

我該如何循環（或者做什麼最好）以便我的視圖結果如此。

<ul class="lakers"> 
    <li>Kobe Bryant is on the lakers</li> 
</ul> 
<ul class="heat"> 
    <li>LeBron James is on the heat</li> 
</ul> 

甚至更​​好不會我需要做一個團隊集合視圖。然後編寫一些代碼將每個玩家與他的團隊進行匹配？所以結果是這樣的。

<div class="lakers">// Teams collection root element 
    <ul>// Players collection root element 
     <li>Kobe Bryant is on the lakers</li>// Player model root elemnt 
    </ul> 
</div> 
<div class="heat">// Teams collection root element 
    <ul>// Players collection root element 
     <li>LeBron James is on the heat</li>// Player model root elemnt 
    </ul> 
</div> 

我把這個企圖，但我想我實例每個觀點是錯誤的方式，或者我只是做了錯事，所以如果這是一個好主意，把球員集合的集合的球隊，我如何得到像上面這樣的結果，我可以在哪裏得到一個球隊的父母成員，然後是這支球隊的球員名單？

---

我的想法&代碼：我的players視圖裏面想我可以寫一些東西，通過團隊組織每個模型，等等。

_.each(this.collection.where({team: "lakers"}), function(model) { 
     var playerView = new PlayerView({ model: model}); 
     this.$el.append(playerView.render().el); 
     this.$el.addClass('lakers'); 
}, this); 

那麼有這個明顯的問題，因爲，我們寫這一切只是爲了一個類添加到根，如果我們再次做到這一點，將不斷增加的根<ul class="lakers miami">這並沒有幫助。

我的想法很少，我得到的圖片我知道我想分類每個球員，但我不能完全弄明白。我傾向於一個球員集合的球員集合，我只是困惑如何匹配this.team.get('name') == this.player.get('name') //相關的東西。我不確定這是否真的有道理，生病承認我需要幫助大聲笑。感恩節快樂每個人，我懷疑今天任何人都在計算器上。

Answer 1

嗯......你並不需要與球員和球隊相匹配。

讓我們從後端的（數據）的角度認爲：

你有一個播放器模式，玩家屬於一個團隊，和一隊有許多球員組隊模式 。爲了找到一個玩家屬於哪個隊伍，我們所要做的就是在玩家模型中添加一個外鍵：team_id：

team_id，是團隊的ID。通常你不想使用名字，因爲：1.它可能會改變，並且當你改變球隊名稱時你不想更新所有球員。 2，效率不高。 （字符串字段與整數字段）ID始終是唯一的，您不應該更改它們。

假設你有科比，與湖人

//here's Kobe 
var kobe = { 
    id: 24, //yea, all models should have their own primary key - id 
    name: 'Kobe', 
    team_id: 3 
} 

//this is Lakers in the database 
var lakers = { 
    id: 3, //id for lakers, 
    name: 'Lakers' 
} 

現在，你如何找到屬於科比對球隊的名字嗎？

讓我們說，你有團隊集合（所有的球隊）

var teams = new Teams([ ..all the teams! .. ]); 

//to find the name of the team 

teams.get(kobe.get('team_id')).get('name'); // you find the model first, then read its name. 

你可以用內線球員的球隊，或分配團隊球員，但你不必。這取決於你的應用程序的主要用途是什麼（或查看）在一些大型應用程序中，你可能會發現人們將團隊包裝進玩家實例的地方，以及玩家被包裹在團隊中的其他地方;

在你的情況下，你似乎還沒有決定如何處理你的視圖。並且，沒有什麼不對的兩個集合傳遞到一個視圖（可是當你必須要做到這一點，它通常意味着你需要重新思考應該如何組織你的頁面）當你實例化視圖

PlayersView = Backbone.View.extend({ 

    initialize: function(options) { 
    //in case teams/players is not passed to the view, we just set them to empty collections 
    this.teams = options.teams || new Teams([]); 
    this.players = options.players || new Players([]); 
    } 

}); 

，通兩個集合：

var playersView = new PlayersView({ 
    players: players, 
    teams: teams 
}); 

，並在您的模板，如果你是剛剛上市的所有球員：

<% _.each(players, function(player) { 
    <% var team = teams.get(player.get('team_id'))%> 
    <%= player.get('name') %> belongs to <%= team.get('name') %> 
}) { %> 

，或者如果你是上市團隊和他們的球員： //在這種情況下，你真的應該建立孩子的意見，而不是做這一切在一個模板

<% _.each(teams, function(team) { 
    <ul class="<%= team.get('name')%>"> 
    <% var teamPlayers = players.where({team_id: team.get('id')}) %> 
     <% _.each(teamPlayers, function(player) { 
      <li> 
      <%= player.get('name') %> belongs to <%= team.get('name') %> 
      </li> 
     <% }) %> 
    </ul> 
}) { %> 

=================

編輯：

在你的代碼

_.each（this.collection.where（{團隊： 「湖人隊」}），功能（模型）{VAR = playerView新playerView（{模式：模型}）; this。$ el.append（playerView.render（）。el）; this。$ el.addClass（'lakers'）; }， 這個）;

你正在重複addClass，在_.each（）這是沒有必要的。既然你已經決定要找到湖人球員，你應該這樣做的模板，或者只是將其指定爲根元素的類名，假設每個團隊在一個視圖：

//this is a view for a Team, it's model should be Team 
TeamView = Backbone.View.extend({ 
    className: function() { 
    return this.model.get('name'); 
    } 
});