TypeError non intercepté: Impossible de lire la propriété 'length' de non défini

Question

Je travaille à la création d'une liste de contacts groupée par la première lettre du nom de famille du contact.

Après une demande de paiement ajax succesfull, le contact est poussé à addContact:

Ajax succès:

ko.utils.arrayForEach(dataJS.contactList, function(c) { 
     contactsModel.addContact(c); 
    }); 

contactsModel.addContact:

//add a contact in the right spot under the right letter 
contactsModel.addContact = function(newContact) { 
    //grab first character 
    var firstLetter = (newContact.lname || "").charAt(0).toUpperCase(); 
    //if it is a number use # 
    if (!isNaN(firstLetter)) { 
     firstLetter = "#"; 
    } 

    //do we already have entries for this letter 
    if (!this.letterIndex[firstLetter]) { 
    //new object to track this letter's contacts 
     var letterContacts = { 
      letter: firstLetter, 
      contacts: ko.observableArray([]) 
     }; 

     this.letterIndex[firstLetter] = letterContacts; //easy access to it 

     //put the numbers at the end 
     if (firstLetter === "#") { 
      this.contactsByLetter.push(letterContacts); 
     } else { 
      //add the letter in the right spot 
      for (var i = 0, lettersLength = this.contactsByLetter().length; i < lettersLength; i++) { 
       var letter = this.contactsByLetter()[i].letter; 

       if (letter === "#" || firstLetter < letter) { 
        break; 
       } 
      } 
      this.contactsByLetter.splice(i, 0, letterContacts); 
     } 
    } 

    var contacts = this.letterIndex[firstLetter].contacts; 

    //now we have a letter to add our contact to, but need to add it in the right spot 
    var newContactName = newContact.lname + " " + newContact.fname; 
    for (var j = 0, contactsLength = contacts().length; j < contactsLength; j++) { 
     var contactName = contacts()[j].lName + " " + contacts()[j].fName; 

     if (newContactName < contactName) { 
      break; 
     } 
    } 

    //add the contact at the right index 
    contacts.splice(j, 0, newContact); 

}.bind(contactsModel); 

Les contacts objet JSON à partir du serveur ressemble à ceci:

{ 
     "total_pages": 10, 
     "page": page, 
     "contactList": [{ 
      "photo": "http://homepage.mac.com/millhouse/Family%20Tree/images/PersonListIcon.png", 
      "lname": "Bond", 
      "id": 241, 
      "fname": "James", 
      "email": "xxx@yahoo.com"}, 

Bien que cela fonctionne dans jsFiddle, quand j'essaie localement, je reçois l'erreur suivante lors de la première poussée à addContact:

Uncaught TypeError: Cannot read property 'length' of undefined 
jQuery.jQuery.extend._Deferred.deferred.resolveWithjquery-1.5.1.js:869 
donejquery-1.5.1.js:6591 
jQuery.ajaxTransport.send.callbackjquery-1.5.1.js:7382 

Idées? Merci

Answer 1

Votre syntaxe semble incorrecte dans les boucles for et ailleurs, c'est () destiné à l'appel de fonctions. Essayez de changer partout où vous avez contactsByLetter() et contacts() à contactsByLetter et contacts.

Answer 2

Assurez-vous envelopper votre déclaration bindings dans un jQuery prêt ...

$(function(){ 
    ko.applyBindings(contactsModel, document.getElementById("view-panel-contacts")); 
}); 

Cela a fonctionné pour moi en utilisant le code fourni dans le violon.

http://pastebin.com/YYfBB0ES