2012-10-26 15 views
12

Inizio con Meteor e adattamento di todo example per includere gruppi di tag nidificati. Ho il seguente codice HTML, il quale emette ogni nome di ciascun gruppo di variabili, più l'elenco dei tag in che ogni gruppo:Meteor: come accedere alle proprietà principali all'interno di modelli nidificati?

<template name="tag_filter"> 
    {{#each tag_types }} 
     {{ tag_name }} 
     {{#each values }} 
     <div data-taggroup="{{ ../tag_name }}"> 
     {{ name }} ({{ count }}) 
     </div> 
     {{/each}} 
    {{/each}} 
</template> 

mia domanda è questa: come faccio a adattare il gestore di eventi per i clic sui tag per accedere al valore del gruppo genitore tag_name? (cioè i dati dall'esterno di ciascun ciclo).

Attualmente ho il codice sotto, ma l'oggetto this mi dà accesso solo a name e count.

Template.tag_filter.events({ 
    'mousedown .tag': function() { 
    console.log('tag mousedown', this); 
    // How do I get the value of tag_name? 
    } 
}); 

Come potete vedere, ho usato Handlebars parent paths per aggiungere un attributo data-taggroup contenente il nome, ma non sono sicuro come accedere che dall'interno del gestore di eventi.

Penso che this question sia correlato, ma non capisco la soluzione dell'OP (in parte perché non sto utilizzando Coffeescript). C'è anche un closed Meteor issue che è correlato.

risposta

3

Non sono sicuro se è possibile ottenere dati del modello padre, ma nel gestore eventi è possibile accedere agli elementi DOM: event.currentTarget otterrà l'elemento selezionato. Quindi usa solo jQuery per accedere agli attributi. Se necessario, event.currentTarget.parentNode otterrà l'elemento genitore nel DOM.

Es: Non so dove si inserisce la classe di tag, ma diciamo che è la classe del div in cui è definito il gruppo di tag di dati. Poi si potrebbe ottenere il nome del tag utilizzando:

$(event.currentTarget).attr('data-taggroup') 
10

ho trovato la soluzione per accedere ai dati genitore:

Template.nestedTemplate.events({ 
    'click a.class':function(event,template){ 
     var parentID = template.data._id; 
     console.log(parentID); 
    } 
}); 

La funzione .eventi gestore riceve due argomenti: eventi, un oggetto con le informazioni sull'evento e template, un'istanza di modello per il modello in cui è definito il gestore. Mi ci è voluto molto tempo per capirlo. Non usare la soluzione manubri, mostra i tuoi dati!

+1

L'ID _id esiste solo se il proprio contesto di dati corrente dispone di tale variabile. È come chiamare 'this._id'. Non so come questo ti permetterebbe di accedere ai dati del genitore? –

+4

questo. otterrà il contesto corrente (ad esempio se sei in un blocco {{each}}), per me 'template' ottiene il contesto dei template, che può differire dal contesto corrente. –

0
"click selected":function(e){ 
    // this._id 
    var doc_id = $(e.currentTarget).parent().parent().attr("uid") 
    console.log(doc_id) 
}, 
//specify the each id in the div above the nearest #each 
//this will work in events but not in helpers` 
Problemi correlati