Knockout: Kann nicht Eigentum lesen ‚x‘ undefinierter

Question

Im einen Uncaught Typeerror erhalten: Kann nicht Eigenschaft ‚Ziel‘ undefinierter lesen, wenn widget.Test() im beforeAppear aufrufen.

define(
      //------------------------------------------------------------------- 
      // DEPENDENCIES 
      //------------------------------------------------------------------- 
     ['knockout'], 

     // ------------------------------------------------------------------- 
     // MODULE DEFINITION 
     // ------------------------------------------------------------------- 
     function (ko) { 

     "use strict"; 

     return { 

      First_Arr: ko.observableArray(['arrayItem0', 'arrayItem1', 'arrayItem2', 'arrayItem3']), 
      Second_Arr: ko.observableArray(['arrayItem0', 'arrayItem1', 'arrayItem2']), 

      Test: function(widget, event) {    

       var element = event.target;   
       var pathname = location.pathname; 
       var anotherArray = [ 
        ["/some-url-path", widget.First_Arr()], 
        ["/some-other-url-path", widget.Second_Arr()] 
       ]; 

       for (var i = 0; i < anotherArray.length; i++) { 
        // Do some stuff and console.log the array items       
       } 

      }, 

      beforeAppear: function(page) { 

       var widget = this; 
       widget.Test(); 

      } 
     } 
    } 
); 

Das Merkwürdige ist, wenn ich einen Knopf meiner Ansicht nach zum Beispiel zu erstellen:

<button id="btn-click" data-bind="click: Test">test</button> 

Und es klicken, dann bekomme ich die gewünschten Ergebnisse des Druckens der Inhalt meiner Array die aus Konsole wie erwartet.

PS. Ich habe versucht, die var element = event.target auskommentieren; Zeile, da ich dachte, dies war die Ursache des Problems, aber dies ergab nur Folgendes: Uncaught TypeError: Kann Eigenschaft 'First_Arr()' von undefined nicht lesen.

Ein bisschen ratlos mit diesem. Jede Hilfe wäre hilfreich.

Answer 1

Wenn Sie anrufen widget.Test() Sie übergeben es keine Ereignisparameter werden so event und event.target Fehler wird nicht definiert werden, da target auf „undefiniert“ existiert nicht. Bei einer Klickbindung wird der Klick "Ereignis" automatisch in die Funktion übernommen.

Das zweite Problem ist, dass var widget = this; im Wesentlichen Einstellung widget = beforeAppear; ist. Innerhalb einer Funktion bezieht sich "dies" auf die Funktion selbst. Siehe How does the "this" keyword work?

Anstatt Ihr Modul als Objektliteral zu definieren, können Sie besser eine Konstruktorfunktion verwenden. Siehe Should I be using object literals or constructor functions?

, die wahrscheinlich etwas aussehen würde:

define(
      //------------------------------------------------------------------- 
      // DEPENDENCIES 
      //------------------------------------------------------------------- 
     ['knockout'], 

     // ------------------------------------------------------------------- 
     // MODULE DEFINITION 
     // ------------------------------------------------------------------- 
     function (ko) { 

     "use strict"; 

     return function(){ 
      var self = this; 

      self.First_Arr = ko.observableArray(['arrayItem0', 'arrayItem1', 'arrayItem2', 'arrayItem3']); 
      self.Second_Arr = ko.observableArray(['arrayItem0', 'arrayItem1', 'arrayItem2']); 

      self.Test = function(widget, event) { 
       var element = event.target;   
       var pathname = location.pathname; 
       var anotherArray = [ 
        ["/some-url-path", self.First_Arr()], 
        ["/some-other-url-path", self.Second_Arr()] 
       ]; 

       for (var i = 0; i < anotherArray.length; i++) { 
        // Do some stuff and console.log the array items       
       }  
      } 

      self.beforeAppear = function(page) { 
       //var widget = this; 
       self.Test();  
      } 
     }(); 
    } 
);