title: Knockout template will not update list when adding to observable array
body: <p>I have a knockout template:</p>
  
  <pre><code>&lt;script type="text/javascript" id="myList"&gt;        
    // template stuff here                   
  &lt;/script&gt;
  </code></pre>
  
  <p>I call it in with the <code>foreach</code> option: </p>
  
  <pre><code>&lt;div data-bind="template: { name:'myList', foreach: ItemList }"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>I get the view model form my controller and use the following Javascript to bind it:</p>
  
  <pre><code>var viewModel = ko.mapping.fromJS(@Html.Raw(JsonConvert.SerializeObject(Model));                                        
  ko.applyBindings(viewModel, document.getElementById("contentsDetails"));
  </code></pre>
  
  <p>I return a few items from my controller and everything renders fine.</p>
  
  <p>My problem is that if I add to my observable array</p>
  
  <pre><code>var itemToAdd = {
              Name:  ko.observable("name a"),
              Desc:  ko.observable("desc a")
   }
  
   viewModel.MyObservableArray().push(itemToAdd);
  </code></pre>
  
  <p>I have checked the array is observable using:</p>
  
  <pre><code> console.log(ko.isObservable(viewModel.MyObservableArray));
  </code></pre>
  
  <p>It does not update the UI template by adding the new item to the list.</p>
  
  <p>What am I doing wrong here?</p>