नॉकआउट: बाइंडिंग

Question

को संसाधित करने में असमर्थ मैंने पहले इस प्रश्न से पूछा लेकिन जवाब नहीं मिला।

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

संपादन योग्य समारोह सही/गलत टॉगल करने के लिए माना जाता है और फिर मोड संपादित करने के लिए जब एक बटन दबाने के लिए स्विच है:

मैं जब मैं अपने कोड चलाने यह त्रुटि संदेश मिलता है। इस बटन को एचटीएमएल में एक फोरच के माध्यम से बुलाया जाता है, इसलिए मुझे लगता है कि यह मेरे व्यूमोडेल के साथ कुछ करने के लिए है। मेरे getJson से प्राप्त आउटपुट ठीक काम करता है लेकिन संपादन योग्य फ़ंक्शन किसी भी तरह से संघर्ष करता है।

<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> 

और यहाँ मेरी जावास्क्रिप्ट है:

 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

मैं इसे अपने कोड से कुछ अब टॉगल ठीक काम कर रहा है बनाया

यहाँ मेरी html कोड है।

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

देखें मॉडल::

कृपया इस Working Fiddle

देखें पाते हैं

$(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); 
}); 

समस्या अभी भी मौजूद है, तो ऊपर बेला का इस्तेमाल करते हैं और निर्माण करने के लिए प्रयास करें अपने इसमें कोड मुझे बताओ।