Knockout: impossibile elaborare il binding

Question

Ho fatto questa domanda in precedenza ma non ho ricevuto risposta.

ricevo questo messaggio di errore quando ho eseguito il mio codice:

Uncaught ReferenceError: Unable to process binding "visible: function(){return !editable() }" 
Message: editable is not defined 

si suppone che la funzione modificabile per alternare vero/falso e quindi passare alla modalità di modifica quando viene premuto un tasto. Questo pulsante è chiamato attraverso un foreach in html quindi immagino che abbia qualcosa a che fare con il mio viewmodel. L'output che ottengo dal mio getJson funziona bene ma la funzione modificabile è in qualche modo in conflitto.

Ecco il mio codice html:

<div><ul data-bind="foreach: comments"> 
    <li class="ul3"> 
    <span class="author" data-bind="text: nickname, visible: !editable(), click: editComment"> 
    </span> 
    <input type="text" data-bind="value: nickname, visible: editable()"/>: 
    <div> 

    <span class="comment" data-bind="text: newMsg, visible: !editable(), click: editComment">  
    </span> 
    <textarea class="myComment" type="text" data-bind="value: newMsg, visible: editable()">      
    </textarea> 

    </div> 
    <button data-bind="click: editComment, text: editable() ? 'Save' : 'Edit comment'">   
    </button> 
    <button data-bind="click: deleteComment">Delete</button> 
      </li> 
     </ul> 
    </div> 

Ed ecco il mio javascript:

 function Comment() { 
    var self = this; 
    self.nickname = ko.observable(); 
    self.newMsg = ko.observable(); 
    self.editable = ko.observable(false); 

    self.sendEntry = function() { 
    vm.selectedComment(new Comment()); 

     if (self.newMsg() !== "" && self.nickname() !== "") { 

      $.post(writeUrl, "entry=" + ko.toJSON(self)); 
      self.newMsg(""); 
     } 
     vm.cSection().getNewEntries(); 
    }; 
    self.deleteComment = function() { 
     vm.comments.remove(self); 
    }; 

    self.editComment = function() { 
     self.editable(!self.editable()); 
    }; 
} 
function commentSection() { 
    var self = this; 
    self.timestamp = 0; 
    var entry; 
    self.getNewEntries = function() { 

     $.getJSON(readUrl, "timestamp=" + self.timestamp, function (comments) { 
      for (var i = 0; i < comments.length; i++) { 
       entry = comments[i]; 
       if (entry.timestamp > self.timestamp) { 
        self.timestamp = entry.timestamp; 
       } 
       vm.comments.unshift(entry); 
      } 
      self.getNewEntries(); 
     }); 
    }; 

} 

function ViewModel(){ 
    var self = this; 

    self.cSection=ko.observable(new commentSection()); 
    self.comments = ko.observableArray(); 
    self.selectedComment = ko.observable(new Comment()); 

    //self.cSection().getNewEntries(); 
} 
var vm=new ViewModel(); 
ko.applyBindings(vm); 
vm.cSection().getNewEntries(); 

}); 

Answer 1

Ho fatto qualcosa dal codice ora alternare sta lavorando bene.

trovi prego questo Working Fiddle

Vista:

<input type="button" 
    data-bind="click: editComment, value:editable() ? 'Save' : 'Edit comment'" /> 

Vista Modello:

$(document).ready(function() { 
    vm = function ViewModel() { 
     var self = this; 
     self.comments = ko.observableArray(); 
     function Comment() { 
      var self=this; 
      self.editable = ko.observable(false); 
      self.editComment = function() { 
       self.editable(!self.editable()); 
      }; 
     } 
     self.comments.push(new Comment()); 
    }; 
    ko.applyBindings(new vm); 
}); 

Se il problema persiste si prega di fare uso di sopra violino e cercare di costruire la vostra codice in esso fammi sapere.