Prevent html Laden vor Laden von Daten in Knockout-Mapping

Question

HTML:

<div id="knockoutBinding"> 
    <div class="toolbar" data-bind="template: 'user-portfolio-entry' "></div> 
</div> 

<script id="user-portfolio-entry" type="text/html"> 
<!-- ko if: vm.currentPortfolioEntry().hasOwnProperty('Step') --> 
//other stuff 
<!-- /ko --> 
</script> 

JavaScript:

var UserPortfolioViewModel = function() { 
     var self = this; 

     self.currentPortfolioEntry = ko.observable(null); 
     $.ajax({ 
      type: "POST", 
      url: getPortfolioEntryUrl, 
      data: JSON.stringify(data1), 
      dataType: "json", 
      contentType: "application/json", 
      success: function (response) { 
       self.currentPortfolioEntry(ko.mapping.fromJS(response)); 
      }, 
      error: function (data) { 
       alert("fail"); 
      } 
     }); 
} 
var vm; 
    $(function() { 
     vm = new UserPortfolioViewModel(); 
     ko.applyBindings(vm, $("#knockoutBinding")[0]); 
    }); 

ich Fehler:

Uncaught TypeError: Unable to process binding "template: function (){return 'user-portfolio-entry' }" Message: Unable to process binding "if: function(){return vm.currentPortfolioEntry().hasOwnProperty('Step') }" Message: Cannot read property 'hasOwnProperty' of null

und wenn die Leitung in Ajax-Erfolg wird ausgeführt self.currentPortfolioEntry(ko.mapping.fromJS(response)); dann kann ich den Wert von vm.currentPortfolioEntry().hasOwnProperty('Step') in der Konsole sehen, aber zu dieser Zeit hatte HTML geladen und ich kann keine Daten in HTML bekommen.

So laden Sie die HTML nach dem Erfolg von AJAX, damit Eigenschaften zugeordnet werden können. Oder eine andere Möglichkeit, diesen Fehler zu beheben?

Answer 1

Sie könnten Ihre if Refactoring, wenn die variablen Ausgänge zu testen wie folgt vor:

<!-- ko if: vm.currentPortfolioEntry() && vm.currentPortfolioEntry().hasOwnProperty('Step') -->