هذا.فيندال لا يعمل على القالب الفرعي

Question

عندما أحاول استخدام هذا.فيندال على قالب حيث المحدد في قالب فرعي ، فيندال بإرجاع أي شيء.

وهنا أتش تي أم أل:

<template name="products">
    {{#each productList}}
        {{> product }}
    {{/each}}
</template>
<template name="product">
    <div class="box">{{name}}</div>
</template>

وهنا جس:

Template.products.helpers({
    productList: function() {
        var all = Products.find({}).fetch();
        return all;
    }
});
Template.products.rendered = function(){
    var boxes = this.findAll('.box');
    console.log(boxes.length);
}

إخراج الصناديق.الطول هو 0.أي أفكار كيف يمكنني الحصول على عناصر "الصندوق"?

Answer 1

إليك الإجابة الصحيحة.لقد أضفت هذا إلى طريق جهاز التوجيه الحديدي:

giveacodicetagpre. تم العثور على

الجواب من https://stackoverflow.com/a/23576039/130237 بينما كنت أحاول حلهامشكلة مختلفة.

Answer 2

وفقا للمستندات ل فيندال:

يمكن فقط للعناصر الموجودة داخل القالب وقوالبه الفرعية مطابقة أجزاء من المحدد.

لذلك يجب أن تعمل للقوالب الفرعية.حاولت هذا مع مجموعة ثابتة من المنتجات وعملت ، مما يعني أنك مجرد رؤية تأخير بين الدعوة إلى rendered والمنتجات التي يتم جلبها.على سبيل المثال إذا كنت تفعل:

Template.products.events({
  'click .box': function (e, t) {
    var boxes = t.findAll('.box');
    console.log(boxes.length);
  }
});

ثم إذا قمت بالنقر فوق أحد المربعات ، فيجب أن ترى الرقم الصحيح الذي تم تسجيله في وحدة التحكم.باختصار ، أعتقد أن الاختبار قد يكون غير صالح.إذا كنت تستخدم جهاز توجيه الحديد ، يمكنك محاولة إضافة ويتون للمنتجات - التي قد تضمن وصولها قبل المكالمة المقدمة.

Answer 3

إليك ما فعلته لتشغيل برنامج نصي بعد تحميل جميع المنتجات.

لقد أضفت خاصية last_product في جميع المنتجات.

giveacodicetagpre.

ثم بدلا من "القالب"، استخدمت "Template.Product" للكشف عن ما إذا كان المنتج الأخير يتم تقديمه.عندما يتم تقديم المنتج الأخير، قم بتشغيل البرنامج النصي.

giveacodicetagpre.

boxes.length لديه الآن الطول الصحيح.

بفضل David للفكرة!