2017-02-12 4 views
0

Ich versuche, Menüdaten nach dem Ajax-Aufruf kehrt von der folgenden Seite angezeigt werden:Uncaught Typeerror: kann nicht lesen Eigenschaft ‚fromJSON‘ undefinierter

<head> 
    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.6/css/bootstrap.min.css"> 

    <script type='text/javascript' src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.1/knockout-min.js"></script> 
    <script type='text/javascript' src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js'></script> 
    <!-- <script type='text/javascript' src='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.6/js/bootstrap.min.js'></script> 
    <script type='text/javascript' src='https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.js'></script> --> 
</head> 


<body> 

    <h1>page loaded</h1> 

    <div data-bind="foreach: menu"> 
     <!-- ko foreach: items --> 
      <span data-bind="$data.name"></span> 
     <!-- /ko --> 
    </div> 
</body> 




<script> 

    function OrderPageViewModel() { 
     var self = this; 

     // self.menu_loaded_success_callback = function(data) { 
     //   var retrieved_menu = data["menu"]; 
     //   self.menu = ko.observable(retrieved_menu); 
     //   console.log(retrieved_menu) 
     //   alert(data); 
     //  } 
     // 
     // self.get_data(menu_url).done(self.menu_loaded_success_callback); 

    } 

    var menu_url = "menu/get-menu"; 

    get_menu_data = function(url_ending){ 
     console.log("running get_data"); 
     var URL = "/api/&/".replace("&", url_ending); 
     console.log("URL: ", URL); 
     return $.ajax({ 
      dataType: "json", 
      url: URL, 
      // type: "GET", 
     }); 
    } 

    get_menu_data(menu_url).done(function(data){ 
     var vm = new OrderPageViewModel(); 
     console.log(data); 
     vm = ko.mapping.fromJSON(data); 
     ko.applyBindings(vm); 
    }).fail(function(){ 
     alert("failed"); 
    }); 

    // ko.applyBindings(new OrderPageViewModel()); 

</script> 

enter image description here

Ich folgte dem Beispiel bei wait for ajax result to bind knockout model und es sagt

Antwort

3

Die fromJSON Methode ist Teil der Knockout mapping plugin, die nicht in der Code-Knockout-Bibliothek enthalten ist.

Sie haben das Mapping-Plugin separat zu schließen, so fügen Sie die folgende Zeile nach dem Knockout aufgenommen haben:

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout.mapping/2.4.1/knockout.mapping.min.js" type='text/javascript'></script> 
Verwandte Themen