如何挑出一個對象數組中的一個項目，然後遍歷其餘項目？

Question

目標：在我想要顯示的陣列中的每個對象中的端部，但我想挑出其中的一個（第一個或隨機的），使得其將具有從的其餘部分不同的類組。

問題：each遍歷所有事物，無所作爲。 with擁有整個事情。什麼只有一件事？

我與所訂閱的一個大項工作，並在它的網頁/路由坐在這樣的事情：

"colors": [ 
    { "shortName": "blue", "trueName": "Sky Blue" }, 
    { "shortName": "red", "trueName": "Blood Red" }, 
    { "shortName": "white", "trueName": "Crystal White" } 
    ] 

我想在頁面上顯示他們每個人，而我這樣做現在正規途徑：

{{#each colors}} 
    <div class="{{shortName}} hidden">{{trueName}}</div> 
{{/each}} 

現在，我只想在時間顯示一種顏色，我希望通過添加類'hidden`所有，但一個實現這一目標。無論哪個被挑選出來都不重要，只是有些事情。

問題是，不同的項目有不同的顏色，所以我不能設置例如white以外的循環，而不是將類hidden添加到它。 white可能不存在。此外，如果我這樣做，它會增加white兩次。

我覺得這像往常一樣，是可笑的簡單，但我嘶嘶的就可以了。誰能幫忙？

Answer 1

您可以使用if/else塊來處理一個集合中的每個元素的兩種方式之一，即表現出來或隱藏。

{{#each colors}} 
{{#if shortName===selected_color}} 
    <div class="{{shortName}}">{{trueName}}</div> 
{{else}} 
    <div class="{{shortName}} hidden">{{trueName}}</div> 
{{/if}} 
{{/each}} 

通過將if/else移動到單個元素中div的選項中，可以減少重複性。

流星通常還提供了jQuery，你可以用它來挑選出一組元素和應用隱藏於所有除之一。