2012-10-26 17 views
12

Meteor ile çalışmaya başladım ve iç içe geçmiş etiket grupları eklemek için todo example'u uyarlamaya başladım.Meteor: İç içe geçmiş şablonlar içindeki ebeveyn özelliklerine nasıl erişilir?

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

Sorum şudur: Her etiket grubunun her isim verir Aşağıdaki HTML, artı her gruptaki etiketlerin listesi var nasıl etiketleri tıklamaları için olay işleyicisi adapte do Ebeveyn grubunun tag_name değerini mi kullanıyorsunuz? (yani, her bir ilmek dışından veriler).

Şu anda aşağıdaki kodu kullanıyorum, ancak this nesnesi yalnızca name ve count erişim sağlar.

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

Gördüğünüz gibi

, adını içeren bir data-taggroup özelliği eklemelerini Handlebars parent paths kullandım ama olay işleyicisi içinden o erişmek için nasıl emin değilim.

Sanırım this question ilişkilidir, ancak OP'nin çözümünü anlamıyorum (kısmen Coffeescript kullanmıyorum). Ayrıca ilgili bir closed Meteor issue var.

cevap

3

Üst şablon verileri alıp alamayacağınızdan emin değilim, ancak olay işleyicinizde DOM öğelerine erişebilirsiniz: event.currentTarget tıklanan öğeyi alır. Daha sonra, niteliklere erişmek için jQuery'yi kullanın. Gerekirse, event.currentTarget.parentNode ana öğeyi DOM'ta alır.

Örn: Etiket sınıfını nereye koyduğunuzu bilmiyorum, ancak diyelim ki veri-taggroup'un tanımlandığı div'inizin sınıfı. Sonra kullanarak etiket adını alabilir:

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

ebeveyni verilerine erişmek için bir çözüm bulundu:

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

.events işleyici işlevi iki argüman alır: olay, olay hakkında bilgileri içeren bir nesne ve şablon, işleyicinin tanımlandığı şablon için bir şablon örneği. Bunu anlamak için gerçekten uzun bir zaman aldı. Gidon çözümünü kullanmayın, verilerinizi gösterir!

+1

'_id 'yalnızca geçerli veri içeriğiniz o değişken kümesine sahipse var olacaktır. Bu thisid’i çağırmakla aynı şey. Ebeveynin verilerine nasıl erişebildiğini bilmiyorum. Bu, –

+4

. geçerli bağlamı alacaktır (örneğin, bir {{each}} bloğundaysanız), 'template', geçerli bağlamdan farklı olabilen şablonlar bağlamını alır. –

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` 
İlgili konular