중첩 된 중첩 observableArrays가 비어있는 대신 정의되지 않은 것처럼 보입니다.

Question

빈 배열 ([])로 초기화 된 중첩 된 observableArrays에 집계 함수를 적용하면 내부 배열이 정의되지 않은 오류가 발생합니다. 이것은 빈 배열을 매개 변수로하여 생성 된 observableArray 객체에서만 발생합니다.

이것은 버그 일 수 있지만, 아마/뭔가 잘 모르겠다.

아래 예제는 빈 배열 라인과 함께 작동 주석 :

을도에 : http://jsfiddle.net/adamtolley/4pZhR/32/

html로 :

<ul data-bind="template: { name: 'outerTmpl', foreach: outerArray}"></ul> 
Number of inner items: <span data-bind="text: innerCount"></span> 
<hr /> 

<div data-bind="text: ko.toJSON(viewModel)"></div> 

<script id="outerTmpl" type="text/html"> 
    <li> 
     <span data-bind="text: name"></span> 
     <ul data-bind="template: { name: 'innerTmpl', foreach: innerArray}"></ul> 
    </li> 
</script> 

<script id="innerTmpl" type="text/html"> 
    <li> 
     <span data-bind="text: name" /> 
    </li> 
</script> 

JS :

function outer(name, innerArray) { 
    return { 
     name: ko.observable(name), 
     innerArray: ko.observableArray(innerArray) 
    }; 
} 

function inner(name) { 
    return { 
     name: ko.observable(name) 
    }; 
} 

var viewModel = { 
    outerArray: ko.observableArray([ 
     new outer("outer1", [new inner("inner1"), new inner("inner2")]), 
     new outer("outer2", [new inner("inner1"), new inner("inner2")]) //, 
     // new outer("outer3", []) //does not work with this line uncommented. 
    ]) 
}; 

//use of innerArray().length vs innerArray.length seems to make no difference in error 
viewModel.innerCount = ko.dependentObservable(function() { 
    return this.outerArray().reduce(function(i, j) { 
     return i.innerArray.length + j.innerArray.length; 
    }); 
}, viewModel); 


ko.applyBindings(viewModel); 

Answer 1

나는 생각한다 더 좋아할만한 것을 원할 것입니다 :

viewModel.innerCount = ko.dependentObservable(function() { 
    return this.outerArray().reduce(function(i, j) { 
     var count = i.innerArray ? i.innerArray().length : i; 
     return count + j.innerArray().length; 
    }); 
}, viewModel); 

reduce는 다음 반복에서 이전 결과를 i으로 전달합니다. 따라서 첫 번째 반복에는 두 개의 배열 만 있습니다.