title: How to late bind a KnockoutJS observable
body: <p>I have a ViewModel with some observables and a property which is only known after the bindings have been applied.</p>
  
  <p>For example, my UI consists of a search box which shows matches underneath.  Initially, the property for the matches inside the view model is null as there is no data to attach.  However, once the search box has at least 3 characters, it will make an AJAX call and fetch the data.</p>
  
  <p>When I call the mapping plugin, to map the data from the call to KO, its as if KO can't late-bind the observable array.  The problem is I don't have anything to give it to map to set-up the bindings in the first place.</p>
  
  <p>My code:</p>
  
  <pre><code>  var vm = new function () {
          var self = this;
  
          self.customers = null;
          self.searchText = ko.observable("");
  
          self.searchText.subscribe(function (data) {
              if (data.length &gt; 2) {
                  // do search
                  $.get("/customers/getall", { searchTerms: self.searchText }, function (resp) {
  
                      if (!self.customers) {
                          // first mapping
                          self.customers= ko.mapping.fromJS(resp.customers);
                      } else {
                          ko.mapping.fromJS(self.customers, resp.customers);
                      }
                  });
              } 
          });
  
      }
  
      ko.applyBindings(vm, $("#searchCustomersScope")[0]);
  </code></pre>