Question

我对Meteor和Blaze很陌生，所以如果有什么不清楚的话，我很抱歉...但我想实现这个＆＃39;产品快速查看＆＃39;我的Meteor项目中的https://codyhouse.co/gem/css-product-quick-view/。

当我不使用每个语句时，动画效果很好。在每个语句中数据上下文发生变化，当我点击cd-trigger时没有任何反应。如何访问此子模板的ParentTemplate.onRendered内的代码？这个问题有一些解决方法吗？

<template name="ParentTemplate">
   {{> Product}} // works properly

   {{#each products}} // does not work
     {{> Product}}
   {{/each}}
</template>

<template name="Product">
  <li class="cd-item">
     <img src="img/item-1.jpg" alt="Item Preview">
     <a href="#0" class="cd-trigger">Quick View</a>
  </li> <!-- cd-item -->
</template>

和.js文件

Template.ParentTemplate.onRendered( function () {
//open the quick view panel
$('.cd-trigger').on('click', function(event){
    console.log('Hello!');
    var selectedImage = $(this).parent('.cd-item').children('img'),
        slectedImageUrl = selectedImage.attr('src');

/the code continues but it is very long/

Answer 1

这解决了问题

Template.ParentTemplate.onRendered( function () {
this.autorun(() => {
   if (this.subscriptionsReady()) {
      //open the quick view panel
      $('.cd-trigger').on('click', function(event){
         console.log('Hello!');
         var selectedImage = $(this).parent('.cd-item').children('img'),
         slectedImageUrl = selectedImage.attr('src');

/the code continues but it is very long/

访问父母＆＃39; onRendered＆＃39;来自childern的js代码在每个语句中生成

1 个答案: