2016-11-30 2 views
0

Ich bin neu in Knockout, haben ausführlich lesen Beiträge, kann aber nicht einfaches Beispiel erhalten in Visual Studio laufen 2015knockoutjs Hallo Welt läuft nicht

immer alle HTML-Tags als Typ oder Namespace Problem gekennzeichnet erhalten in Debugger, und wenn ich sowieso laufe, sehe ich leere Kästchen. Hier

ist der Code:

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <title> Home Page</title> 
    <script type='text/javascript' src='jquery-1.10.2.min.js'></script> 
    <script type='text/javascript' src='knockout-20.3.0.debug.js'></script> 
</head> 
<body> 
    <p>First name: <input data-bind="value: firstName" /></p> 
    <p>Last name: <input data-bind="value: lastName" /></p> 
    <h2>Hello, <span data-bind="text: fullName"> </span>!</h2> 

<script type="text/javascript"> 
    // Here's my data model 
    function viewModel() { 
     this.firstName = ko.observable('Planet'); 
     this.lastName = ko.observable('Earth'); 
     this.fullName = ko.computed(function() { 
      // Knockout tracks dependencies automatically. 
      return this.firstName() + " " + this.lastName();},this); 
     }; 

    ko.applyBindings(viewModel()); // This makes Knockout get to work 
</script> 
</body> 
</html> 
+0

Bitte fügen Sie weitere Kontext hinzu. Was ist die Projektvorlage, die du verwendest? Wie sieht Ihre Projekt-/Lösungsstruktur aus? – rawel

+3

Sind Sie sicher, dass die Knockout-Skriptversion 'knockout-20.3.0'? Oder sollte es "knockout-2.3.0" sein? – gkb

Antwort

1

ich Ihnen beispielsweise überprüft es funktioniert gut, wenn richtige Version von Knockout setzen. Ich stelle Version, die älter ist. Bitte überprüfe dein Knockout Skript src, ich hoffe, es wird dir helfen.

<!DOCTYPE html> 
<html> 
    <head> 
     <meta charset="utf-8"> 
     <title> Home Page</title> 
     <script type='text/javascript' src='https://code.jquery.com/jquery-1.10.2.min.js'></script> 
     <script type='text/javascript' src='https://cdnjs.cloudflare.com/ajax/libs/knockout/2.0.0/knockout-debug.js'></script> 
    </head> 
    <body> 
     <p>First name: <input data-bind="value: firstName" /></p> 
     <p>Last name: <input data-bind="value: lastName" /></p> 
     <h2>Hello, <span data-bind="text: fullName"> </span>!</h2> 

     <script type="text/javascript"> 
      // Here's my data model 
      function viewModel() { 

       this.firstName = ko.observable('Planet'); 
       this.lastName = ko.observable('Earth'); 
       this.fullName = ko.computed(function() { 
        // Knockout tracks dependencies automatically. 
        return this.firstName() + " " + this.lastName();},this); 
       }; 

      ko.applyBindings(new viewModel()); 
     </script> 
    </body> 
</html> 
+0

Nur zur Verdeutlichung im OP wird das viewModel nicht mit dem neuen Operator aufgerufen – Jonathan