Knockout.js 自定义绑定 "Update Function is Not called "

Question

我有以下自定义绑定，它的星级，在为我加载页面时调用了 init 和 update 但在那之后，只调用了 init 函数而不是 update 函数。我需要更新功能，其中有 class "Chosen" 切换 class，选择后将 class 添加到星号绑定。我遇到了这个好心建议的问题。

    <div data-role=view id="view1">
    <div id="divstarRating" data-bind="click:selectStar">
    <span id="Star" data-bind="readonlyStarRating:starpoints"> </span>
    </div>
    </div>
.starRating span {
  width: 24px;
  height: 24px;
  background-image: url(../star.png);
  display: inline-block;
  cursor: pointer;
  background-position: -24px 0;
 }

 .starRating span.chosen {
  background-position: 0 0;
 } 

 .starRating:hover span {
 background-position: -24px 0;  
transform: rotate(-15deg) scale(1.3);
}

.starRating:hover span.hoverChosen {
 background-position: 0 0;
 transform: rotate(-15deg) scale(1.3);
  }

   function StarViewModel() {
    self.starpoints= ko.observable();

    self.selectStar=function(){
    window.location.href="view1"
     //here i get selected star value
      starValue=self.starpoints()

      //here i am using ajax to post star value
           $.ajax({
                type: "POST",
                dataType: "json",
                data: Model,
                url: serverUrl + 'xxx/xx/xx',
                success: function (data) {
                    $('#loading-image').hide();
                  // after susccees of post success ajax data consist of star rating value
                   self.starpoints= ko.observable(data);
                },
      }
   }

    $(document).ready(function () {
     ko.bindingHandlers.readonlyStarRating =
 {
 init: function (element, valueAccessor) {
 $(element).addClass("readonlyStarRating");
for (var i = 0; i < 5; i++)
 $("<span>").appendTo(element);
         $("span", element).each(function (index) {
         var observable = valueAccessor();
         $(this).hover(
             function () { 
 $(this).prevAll().add(this).addClass("hoverChosen") },
             function () { 
 $(this).prevAll().add(this).removeClass("hoverChosen") }
         )
      });
  },
  update: function (element, valueAccessor) {
     var observable = valueAccessor();
     $("span", element).each(function (index) {
     $(this).toggleClass("chosen", index < observable());
     });
    }
  }
    ViewModel = new StarViewModel();
    ko.applyBindings(ViewModel);
  });

Answer 1

从你的 jsFiddle，在你的 okay() 函数中：

self.okay = function ()
{
    data = self.UserFeedpoint
    self.UserFeedpoints = ko.observable(data);
    window.location.href = "#home1"
}

您正在用新的可观察对象覆盖 UI 绑定的可观察对象。您只需要更改它以更新现有的可观察对象。喜欢：

self.okay = function ()
{
    data = self.UserFeedpoint
    self.UserFeedpoints(data);
    window.location.href = "#home1"
}

Knockout.js 自定义绑定 "Update Function is Not called "

Knockout.js Custom Binding "Update Function is Not called "

javascript

jquery

knockout-2.0

knockout.js