Impresión de Modelo Ember.js en manillares

Question

Tengo el siguiente código Ember.js:

app.js:

Game = Ember.Application.create({
    ready: function() {
        Game.gameController.getChallenge();
        Game.gameController.participants.pushObject(Game.participants("player1","player1.jpg"));
    }   
});

Game.challenge = Ember.Object.extend({
    challengetype: null,
    description: null,
    id: null
});

Game.participants = Ember.Object.extend({
    name: null,
    image: null  
});

Game.gameController = Ember.ArrayController.create({
    content: [], 

    current: "",

    participants: [],

    getChallenge: function() {
        var self = this;
        var url = "http://api:9393/challenge";
        $.getJSON(url, function(data) {
            self.insertAt(0,Game.challenge.create(data.challenge));
            self.set('current', data.challenge.description);
        }); 
    },  
});

Game.NewChallengeView = Ember.View.extend({
    click: function(evt) {
        Game.gameController.getChallenge();
    }
});

y la plantilla:

<div id="participants">
    {{#each Game.gameController.participants}}
        {{name}}  
    {{/each}}
</div>

current challenge:
<div class="tooltips-gray">
    {{Game.gameController.current}}
</div>

Tengo 2 preguntas:

• Estoy usando actualmente como una cadena porque no sé cómo usar Obtener el primer elemento de la matriz.Mi idea es imprimir el primer elemento de la matriz con una clase CSS diferente.

• El segundo es, cómo imprime la matriz de participantes.Si pongo 4 jugadores en la matriz de participantes, cada uno hace 4 iteraciones.Pero no sé cómo imprimir los campos como el nombre o la imagen.

  gracias.

Answer 1

I've converted your code to a working fiddle here: http://jsfiddle.net/KbN47/8/

The most natural way to bind to the first element of the array is using firstObject. As of Ember 0.9.5, firstObject and lastObject are not observable, due to performance impact. The Ember team hopes to fix this in the future.

If you don't plan to make many changes to the array in your app, the naive override of firstObject I provided in the fiddle should work for you.

Regarding your second question, I extracted the participants to separate controller for clarity and fixed a few issues with your code.