바인딩 (배열 내의 배열) 내에서 녹아웃 foreach 바인딩

Question

나는 두 개의 클래스가 있습니다. 사용자 및 독서.

/* 
* Reading class 
* containts health readings 
*/ 
function Reading(date,weight,glucose) 
{ 
    var self = this; 

    self.date=ko.observable(date); 
    self.weight=ko.observable(weight); 
    self.glucose=ko.observable(glucose); 

     self.formattedWeight = ko.computed(function(){ 
     var formatted = self.weight(); 

     return formatted+" lb" 
    }); 
} 

/* 
* User class 
* contains a user name, date, and an array or readings 
*/ 
function User(name,date,readings) { 
    var self = this; 

    self.name = name; 
    self.date = date; 
    self.readingsArray = ko.observableArray([ 
     new Reading(99,99) 
    ]); 
} 

내가 읽기 또는 사용자에 대한 정보를 표시하는 바인딩의 foreach를 사용하는 방법을 알고 : 각 사용자에게 헬스 케어 측정들의 어레이를 가진다 이것에 관한 것이다. 하지만 사용자의 독서를 보여주는 방법을 모르겠습니까?

중첩 된 foreach 바인딩 또는 바인딩을 사용하는 방법은 무엇입니까? 여기 내 HTML입니다 :

<h2>Users (<span data-bind="text: users().length"></span>)</h2> 

<table> 
    <thead><tr> 
     <th>User name</th><th>Date</th></th> 
    </tr></thead> 
    <!-- Todo: Generate table body --> 
     <tbody data-bind="foreach: users"> 
    <tr> 
     <td><input data-bind="value: name" /></td> 
     <td><input data-bind="value: date" /></td> 
     <td data-bind="text: readingsArray"></td> 
     <td><a href="#" data-bind="click: $root.removeUser">Remove</a></td>    
    </tr> 
    </tbody> 
</table> 

<button data-bind="click: addUser">Add User</button> 

<h2>Readings (<span data-bind="text: readings().length"></span>)</h2> 
    <table> 
    <thead><tr> 
     <th>Date</th><th>Weight</th><th>Glucose</th> 
    </tr></thead> 
    <!-- Todo: Generate table body --> 
     <tbody data-bind="foreach: readings"> 
    <tr> 
     <td strong data-bind="text: date"></td> 
     <td strong data-bind="text: formattedWeight"></td> 
     <td strong data-bind="text: glucose"></td> 
    </tr> 
    </tbody> 
</table> 

그리고 관심있는 사람은 여기 내 모델입니다. 어떤 도움이라도 대단히 감사하겠습니다! 미리 감사드립니다! 당신은 단순히 새로운 바인딩 컨텍스트를 시작하는 또 다른 foreach 문을 사용하고 렌더링 할 수

http://jsfiddle.net/jearles/aZnzg/

:

// Overall viewmodel for this screen, along with initial state 
function userHealthModel() { 
    var self = this; 
    self.inputWeight = ko.observable(); 
    self.inputDate = ko.observable(); 
    self.inputId = ko.observable(); 
    self.inputGlucose = ko.observable(); 

    // Operations 
    self.addUser = function(){ 
     self.users.push(new User("",0,0,(new Reading(0,0)))); 
    } 
    //adds a readings to the edittable array of readings (not yet the reading array in a user) 
    self.addReading = function(){ 
     var date = self.inputDate(); 
     var weight = self.inputWeight(); 
     var glucose = self.inputGlucose(); 
     if((weight&&date)||(glucose&&date)) 
     { 
      self.readings.push(new Reading(date,weight,glucose)); 
     } 
     else{ 
      alert("Please complete the form!") 
     } 
    } 

    self.removeUser = function(userName){self.users.remove(userName)} 

    //editable data 
    self.readings = ko.observableArray([ 
     new Reading(12,99,3),new Reading(22,33,2), 
     new Reading(44,55,3) 
    ]); 

     self.users = ko.observableArray([ 
     new User("George",2012), 
     new User("Bindu",2012) 
    ]); 

} 

ko.applyBindings(new userHealthModel()); 

Answer 1

난 당신이 독서 렌더링하지만, 여기에 예입니다 방법을 모르겠어요 당신이 원하는대로 속성.