이. Sub-Template에서 작동하지 않습니다

Question

selector가 하위 템플리트에있는 템플릿 에서이 .findAll을 사용하려고하면 FindAll은 아무 것도 반환하지 않습니다.

여기 HTML입니다.

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

.

여기에 JS :

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);
}

.

boxes.length의 출력은 0입니다. "상자"요소를 얻을 수있는 아이디어는 무엇입니까?

Answer 1

여기에 정답이 있습니다.나는 이것을 철 - 라우터 경로에 추가했다 :

action : function () {
    if (this.ready()) {
        this.render();
    }
}

.

https://stackoverflow.com/a/23576039/130237 에서 해결하려고 했는 동안 답변을 찾았습니다.다른 문제.

Answer 2

"Nofollow"> FindAll :

의 문서에 대한 문서에 따르면

템플릿 내부의 요소와 하위 템플릿은 선택기의 일부를 일치시킬 수 있습니다.

하위 템플릿에서 작동해야합니다.나는 이것을 고정 된 제품으로 시도했으며 그것이 효과적으로 rendered의 호출과 인출되는 제품 사이의 지연을 보는 것을 의미한다는 것을 의미합니다.예를 들어, 수행하는 경우 :

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

.

그런 다음 상자 중 하나를 클릭하면 콘솔에 로그 된 올바른 번호가 표시됩니다.간단히 말해서, 나는 시험이 무효화 될 수 있다고 생각한다.Iron-Router를 사용하는 경우 렌더링 된 호출 전에 도착할 수 있도록 제품에 대해 WaitTON을 추가 할 수 있습니다.

Answer 3

모든 제품이로드 된 후 스크립트를 실행하는 것입니다.

모든 제품에 last_product 속성을 추가했습니다.

Template.products.helpers({
    productList: function() {
        var all = Products.find({}).fetch();
        var total = all.length;
        var ctr = 0;
        all.forEach(function(doc){
            doc.last_product = false;

            ctr++;
            if(ctr == total)
            {
                doc.last_product = true;
            }
            return doc;
        });
        return all;
    }
});

.

그런 다음 "template.products"대신 "template.product"를 사용하여 마지막 제품이 렌더링되는지 감지했습니다.마지막 제품이 렌더링되면 스크립트를 실행하십시오.

Template.product.rendered = function(){
    if(this.data.last_product){
        var boxes = $('.pbox');
        console.log(boxes.length);
    }
}

.

boxes.length 가제 올바른 길이가 있습니다.

아이디어를 위해 다윗 덕분에!