2012-10-09 3 views
5

Vorrei vedere alcune informazioni di contatto (nome, email, ...) raggruppate dal Dipartimento ma non riesco a raggiungerlo con Handlebars.Ember.js: Come visualizzare i dati da Ember.Map

  • Dipartimento X

    • informazioni di contatto x1
    • Informazioni contatto x2
    • ...
  • Dipartimento Y

    • Informazioni contatto Y1
    • informazioni di contatto Y2
    • ...

Non so quanti dipartimenti ho in anticipo. Così, nel mio controller ho provato a caricare le informazioni in una Ember.Map dove i dipartimenti sono le sue chiavi e l'array con le informazioni dei contatti è il valore per ogni reparto. E 'qualcosa di simile:

map = Ember.Map.create(); 
// Load data from server into map 
// m = {'Department X': [{name:'x1','email':'emailx1',...},{...}], 'Department Y':[....], ...} 

{{#each department in map}} 
    {{department}} 
    {{#each contact in map.keys}} 
     {{contact.name}} | {{contact.email}} 
    {{#each}} 
{{#each}} 

Un errore viene generato dicendo che "il contenuto di un EmberCollectionView deve implementare Ember.Array Hai superato [object Object]". È possibile ottenere suh un'attività con dati annidati? Qualsiasi aiuto sarà benvenuto. Grazie.

risposta

5

Che dire di creazione di una classe Dipartimento come questo:

App.Department = Ember.Object.extend({ 
    name: null 
    contacts: null // will be an array of App.Contact 
}) 

e una classe di contatto come questo:

App.Contact = Ember.Object.extend({ 
    name: null, 
    email: null, 
}) 

Durante il caricamento dei dati, si può semplicemente costruire una serie di dipartimenti

App.departments = []; 

// parse the arriving json and populate the departments array 
App.departments.pushObject(
    App.Department.create(
     {name: dptLoadedName, contacts: [App.Contact.create({...})]} 
    ) 
) 

Quindi, nel tuo modello, puoi fare qualcosa del tipo:

{{#each department in App.departments}} 
    {{department.name}} 
    {{#each contact in department.contacts}} 
    {{contact.name}} | {{contact.email}} 
    {{#each}} 
{{#each}} 
+0

Perfetto! In attesa di una risposta, stavo provando esattamente questo e funziona perfettamente. Stavo cercando di usare Ember.Map perché provengo dall'universo Java e ho usato questo compito con Map nei miei template. Grazie mille – erbihanka