2

我正在尝试学习 Knockoutjs，但在向 observablearray 添加和删除对象时遇到了一些问题。

我有以下视图模型，我在其中从 Web 服务获取一些数据并填充一些 html。这工作正常。但是不起作用的是从 observablearray 中删除项目，因为单击事件似乎没有调用 removeEmployee。

function EmployeeViewModel(){
    var self=this;

    self.employees=ko.observableArray();

    self.removeEmployee = function(item) {
        self.employees.remove(item);
    };
}

function success(data) {
    EmployeeViewModel.employees=ko.mapping.fromJS(data);
    ko.applyBindings(EmployeeViewModel);    
};

ApiCall({
    data: {
      [get data]
    },
    onSuccess: function(data){success(data.result)} 
});

和以下html：

<div data-bind="foreach: employees">   
    <h2>Hello, <span data-bind="text: full_name"> </span>!</h2>  
    <button data-bind="click: $parent.removeEmployee">Remove</button>
 </div>

我曾尝试在这里设置一个 jsfiddle：http: //jsfiddle.net/8yX5M/，其中删除项目确实有效。不同之处在于，在 jsfiddle 中，项目不是从外部源获取的，并且我使用 removeEmployee 而不是 $parent.removeEmployee。

任何想法为什么非 jsfiddle 版本不起作用？

谢谢托马斯

4

2 回答 2

1

因为您的成功函数没有设置 observableArray 的值，所以它正在重置对象的定义 -

function success(data) {
    EmployeeViewModel.employees(ko.mapping.fromJS(data));
    ko.applyBindings(EmployeeViewModel);    
};

通过使用 () 并传入一个值，在 EmployeeViewModel.employees 上使用 setter 函数。

于 2013-10-15T21:10:13.123 回答
-2

原来是因为我在映射数据之前没有将 EmployeeViewModel 实例化为全局变量。

工作代码是

'use strict';

var employeeViewModel=new EmployeeModel();
function EmployeeModel(){
    var self=this;
    self.employees=ko.observableArray();

self.removeEmployee = function(item) {
    self.employees.remove(item);
    };
}

function getEmployeesSuccess(data,controlIds) {
    employeeViewModel.employees=ko.mapping.fromJS(data);
    var _i=0;
    for (var _total=controlIds.length; _i < _total; _i++) {
        ko.applyBindings(employeeViewModel,$("#"+controlIds[_i])[0]);    
    }
};

/* Databinds employeedata to an array of controls */
/* controlIds=Array of controls*/
function DataBindEmployees(controlIds)
{
ApiCall({
    data: {
      [get data]
    },
    onSuccess: function(data){getEmployeesSuccess(data.result, controlIds)} });
};
于 2013-10-17T05:29:45.157 回答