Chức năng gọi điện Knockout JS khi tải

Question

Tôi đang sử dụng Knockout.js để xây dựng mô hình xem phía máy khách. Trong mô hình khung nhìn của tôi, tôi muốn trưng ra một số chức năng có thể bị ràng buộc với các phần tử trong trang (mô hình MVVM điển hình). Tôi chỉ muốn các chức năng này được gọi là để đáp ứng với một sự kiện nhấp chuột từ một nút, tuy nhiên họ đang được gọi khi mô hình xem được được xây dựng ...

tôi đã xác định mô hình của tôi như thế này:

<script type="text/javascript"> 
var ViewModel = function(initialData) { 
    var self = this; 

    self.id = initialData; 
    self.isSubscribed = ko.observable(false); 
    self.name = ko.observable(); 

    self.SubscribeToCategory = function() { 
     $.ajax({ 
      url: '@Url.Action("Subscribe", "Category")', 
      type: 'POST', 
      data: { 
       categoryId: self.id 
      }, 
      success: function() { 
       self.isSubscribed(true); 
      }, 
      failure: function() { 
       self.isSubscribed(false); 
      } 
     }); 

     alert('Subscribing...'); 
    }; 

    self.UnsubscribeFromCategory = function() { 
     $.ajax({ 
      url: '@Url.Action("Unsubscribe", "Category")', 
      type: 'POST', 
      data: { 
       categoryId: self.id 
      }, 
      success: function() { 
       self.isSubscribed(false); 
      }, 
      failure: function() { 
       self.isSubscribed(true); 
      } 

     }); 

     alert('Unsubscribing...'); 
    }; 

    self.LoadCategory = function() { 
     $.ajax({ 
      url: '@Url.Action("GetCategory", "Category")', 
      type: 'POST', 
      async: true, 
      data: { 
       categoryId: self.id 
      }, 
      dataType: 'json', 
      success: function (data) { 
       self.isSubscribed(data.IsSubscribed); 
       self.name(data.Name); 
      } 
     }); 
    }; 

    self.LoadCategory(); 
}; 


$(document).ready(function() { 
    var data = '@Model'; 
    var viewModel = new ViewModel(data); 
    ko.applyBindings(viewModel); 
}); 

Tuy nhiên, khi tôi thực thi mã, hai cảnh báo sẽ tự động kích hoạt nhưng tôi không mong đợi. Tôi đang sử dụng ASP MVC4, và HTML được sử dụng mô hình xem là dưới đây:

<p> 
    ID: <span data-bind="text: id"></span> 
</p> 
<div id="subscribe" data-bind="visible: isSubscribed == false"> 
    <button data-bind="click: SubscribeToCategory()">Subscribe</button> 
</div> 
<div id="unsubscribe" data-bind="visible: isSubscribed == true"> 
    <button data-bind="click: UnsubscribeFromCategory()">Unsubscribe</button> 
</div> 
<div> 
    Category Name: <span data-bind="text: name"></span>Is Subscribed: <span data-bind="text: isSubscribed"> 
    </span> 
</div> 

Tôi đã nhìn qua hướng dẫn trực tuyến và một số mẫu loại trực tiếp khác, cũng như những nơi khác trong mã của tôi, nơi tôi có sử dụng loại trực tiếp, nhưng tôi không thể thấy lý do tại sao hai chức năng (SubscribeToCategory và UnsubscribeFromCategory) đang kích hoạt khi tải tài liệu.

Answer 1

jsfiddle

Nó đã cho tôi một thứ hai, nhưng cuối cùng lại là một sửa chữa đơn giản. loại bỏ() từ dữ liệu của bạn-ràng buộc = "click: SubscribeToCategory()" và làm cho cả hai bạn bấm xử lý dữ liệu này-ràng buộc = "click: SubscribeToCategory" và dữ liệu-ràng buộc = "bấm: UnsubscribeFromCategory"

Answer 2

Dường như các dấu ngoặc trong tên hàm trong ràng buộc <button data-bind="click: SubscribeToCategory()">Subscribe</button> là vấn đề.

() không nên ở đó. Vì vậy, nó sẽ giống như:

<button data-bind="click: SubscribeToCategory">Subscribe</button>