2014-12-05 4 views
0

나는이 물건을 가지고있다.콧수염 정수를 반복 할 수 있습니까?

{ 
    "myValue": 5 
} 

콧수염 템플릿에서 1 ... 5까지 반복 할 수 있는지 궁금하십니까?

{{#myValue}} 
    {{.}} 
{{/myValue}} 

인쇄 :이처럼 Thaylon의 코멘트 @에 확장

12345 
+0

이거 가능하지 않습니다. 템플릿에서 설명한 뷰는 데이터를 나타내며 데이터는 배열이 아니라 정수입니다. 분명한 해결책은 바인딩하기 전에 데이터를 { "myValue": [1,2,3,4,5]}로 변경하는 것입니다. – Thaylon

답변

3

, 당신이 아닌 숫자를 반복하는 배열이 필요합니다. range() 도우미 퍼팅에 대한 대안으로

var ractive = new Ractive({ 
 
    el: 'main', 
 
    template: '#template', 
 
    data: { 
 
    myValue: 5, 
 
    range: function (low, high) { 
 
     var range = []; 
 
     for (i = low; i <= high; i += 1) { 
 
     range.push(i); 
 
     } 
 
     return range; 
 
    } 
 
    } 
 
});
<script src="http://cdn.ractivejs.org/latest/ractive.js"></script> 
 

 
<main></main> 
 

 
<script id='template' type='text/ractive'> 
 
    {{#each range(1, myValue)}} 
 
    <p>{{this}}</p> 
 
    {{/each}} 
 
</script>

:하지만 [1,2,3,4,5]-5에서 myValue를 변경하는 옵션이 아니다라고 가정하면, 당신은 당신이 당신의 템플릿에서 사용할 수있는 도우미 기능을 추가 할 수 있습니다 data 객체에이 같은 일을 수행하여 일반 도우미로 추가 할 수 있습니다

var helpers = Ractive.defaults.data; 

helpers.range = function (low, high) { 
    var range = []; 
    for (i = low; i <= high; i += 1) { 
    range.push(i); 
    } 
    return range; 
}; 

var ractive = new Ractive({ 
    el: 'main', 
    template: '#template', 
    data: { 
    myValue: 5 
    } 
}); 
+0

우수! 간단하고 쉬운. – CosX

0
<script type="text/javascript"> 
    var sampleVal = '{{foo}}'; 
    // or var sampleVal = '{{foo.foo}}'; 
    for (var i = 0; i < sampleVal; i++) { 

    } 
</script>