title: nested foreach loop when the inner loop array has more than one field
body: <p>what changes are to be made to view and the viewmodel in the following example if the children array has two more fields 
  "child age" and "weight".</p>
  
  <p>view:</p>
  
  <pre><code> &lt;h2&gt;People&lt;/h2&gt;
  &lt;ul data-bind="foreach: people"&gt;
  &lt;li&gt;
      &lt;div&gt;
          &lt;span data-bind="text: name"&gt; &lt;/span&gt; has &lt;span data-bind='text: children().length'&gt;&amp;nbsp;&lt;/span&gt; children:    
      &lt;/div&gt;
      &lt;ul data-bind="foreach: children"&gt;
          &lt;li&gt;
              &lt;span data-bind="text: $data"&gt; &lt;/span&gt;                
          &lt;/li&gt;
      &lt;/ul&gt;
  &lt;/li&gt;
  </code></pre>
  
  <p></p>
  
  <p>viewmodel:</p>
  
  <pre><code>var Person = function(name, children) {
  this.name = name;
  this.children = ko.observableArray(children);
  
  this.addChild = function() {
      this.children.push("New child");
  }.bind(this);
   }
  
  var viewModel = {
  people: [
      new Person("Annabelle", ["Arnie", "Anders", "Apple"]),
      new Person("Bertie", ["Boutros-Boutros", "Brianna", "Barbie", "Bee-bop"]),
      new Person("Charles", ["Cayenne", "Cleopatra"])
      ],
  };
  
  ko.applyBindings(viewModel);
  </code></pre>