Question

我开始使用Knockout并遇到点击事件未触发的问题。

上面没有触发GetWaiters函数。不确定我做错了什么或错过了什么。

TIA

我有以下html：

<h2>Create</h2>
<table>
    <thead>
        <tr>
            <th>WaiterId</th>
            <th>RestId</th>
            <th>Name</th>
        </tr>
    </thead>
    <tbody data-bind="foreach: Waiters">
        <tr>
            <td data-bind="text: waiter_id"></td>
            <td data-bind="text: rest_id"></td>
            <td data-bind="text: name"></td>
        </tr>
    </tbody>
</table>
<br />
@Scripts.Render("~/bundles/myBundle")   
<input type="button" id="btnGetWaiters" value="Get Waiters" data-bind="click: GetWaiters" />

And following in my js file:

var WaiterViewModel = function () {
    //Make the self as 'this' reference
    var self = this;
    //Declare observable which will be bind with UI 
    self.waiter_id = ko.observable("0");
    self.rest_id = ko.observable("0");
    self.name = ko.observable("");

    //The Object which stored data entered in the observables
    var WaiterData = {
        waiter_id: self.waiter_id,
        rest_id: self.rest_id,
        name: self.name
    };

    //Declare an ObservableArray for Storing the JSON Response
    self.Waiters = ko.observableArray([]);

    GetWaiters(); //Call the Function which gets all records using ajax call

    //Function to Read All Employees
    function GetWaiters() {
        alert("fetching");
        //Ajax Call Get All Employee Records
        $.ajax({
            type: "GET",
            url: "/api/WaiterAPI",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (data) {
                self.Waiters(data); //Put the response in ObservableArray
            },
            error: function (error) {
                alert(error.status + "<--and--> " + error.statusText);
            }
        });
        //Ends Here
    }
};
ko.applyBindings(new WaiterViewModel());

Answer 1

当您尝试绑定click事件时，绑定方法应该是视图模型的方法，但在您的实现中GetWaiters()被声明为私有方法。像这样定义这个方法，然后再试一次：

self.GetWaiters =  function() {
    // your code
};

Answer 2

你的功能很好，但你宣布的方式不对。

首先尝试检查您的模型console.log(new WaiterViewModel())。你会发现它没有任何名为GetWaiters()的函数。回顾@vadim回答GetWaiters() is declared as private method。

您需要做的就是将GetWaiters()与您的viewmodel相关联。例如，就像你对waiter_id所做的那样，所以声明如下：

self.GetWaiters =  function() { //your code goes here }

调用它使用此self.GetWaiters()

Answer 3

小提示

我遇到类似问题，事件点击绑定未触发。在我的情况下，问题是拼写错误函数名称。问题是，在这种情况下，淘汰是非常安静的，因为选择立即执行的绑定，你在控制台中得到适当的错误。

MVC4 Knockout数据绑定点击事件未触发

3 个答案: