2017-10-26 1 views
0

data-bind: foreach을 두 개 이상의 배열에 사용할 수 있습니까? 예를 들어
: 그것은 가능하면데이터 배열 : {foreach : ...} 여러 배열의 경우

<div data-bind="foreach: arrayone, arraytwo"> 
    //do stuff 
</div> 

, 그것에 대한 올바른 구문은 무엇인가? 또는이 작업을 수행하는 올바른 방법은 무엇입니까 (두 배열을 병합하는 것 외에)?

+0

나는이조차 어떻게 할 것인지 확실하지 않다. 예상되는 행동은 무엇입니까? arrayone의 모든 인덱스에 대해 arraytwo를 통해 완전히 루프하고 싶습니까? –

답변

1

공식적인 방법은 없지만 긴 배열의 경우 $index과 함께 foreach을 사용하는 것이 좋습니다. 이런 식으로 뭔가 :

var model = function() { 
 
    var self = this; 
 
    
 
    self.arr1 = ko.observableArray([1,2,3, 5, 6]); 
 
    self.arr2 = ko.observableArray([1,2,3,4]); 
 
    
 
} 
 

 
ko.applyBindings(new model());
span { 
 
    font-weight: bold; 
 
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script> 
 
<br/> 
 

 
<div data-bind="foreach: (arr1().length > arr2().length ? arr1 : arr2)"> 
 
    Index: 
 
    <span data-bind="text: $index"></span>, 
 
    
 
    Array 1: 
 
    <span data-bind="text: $root.arr1()[$index()]"></span>, 
 
    Array 2: 
 
    <span data-bind="text: $root.arr2()[$index()]"></span>, 
 
    Longer array: 
 
    <span data-bind="text: $data"></span>, 
 
    Shorter array: 
 
    <span data-bind="text: ($root.arr1().length < $root.arr2().length ? $root.arr1()[$index()] : $root.arr2()[$index()])"></span> 
 
    <br/> 
 
</div>