Javascript 为什么这个绑定的敲除元素没有定义？

使用TypeScript和Knockout构建页面。加载页面时，viewmodel将创建一个值并将其分配给对象的“车辆”数组

vehicles: KnockoutObservableArray<Vehicle>;

constructor() {
    // uses and API to fetch data into a "vehicleData" array
    this.vehicles = ko.observableArray(vehicleData);
}

它按预期传递参数，但当它试图删除时，它声称“车辆”不再存在

Uncaught TypeError: Cannot read property 'remove' of undefined
    at Object.VehicleManagementViewModel.removeVehicle
    at HTMLButtonElement.<anonymous> (knockout-latest.js:99)

Uncaught TypeError:无法读取未定义的属性'remove'
在Object.VehicleManagementViewModel.removeVehicle
在HTMLButtoneElement。（淘汰赛最新版本。js:99）

---

是什么导致数组未定义？当HTML元素被正确绑定到它时，它怎么可能是未定义的呢

我手头没有敲除/键入脚本设置来尝试此操作，但我会猜测，“this”已丢失对函数中父类的引用

如果您查看knockout主页上的一个示例，您可以看到他们使用“self”变量来存储“this”引用。可能模板没有使用正确的“this”值调用函数。使用console.log查看“this”值是什么

<ul data-bind="foreach: places">
    <li>
        <span data-bind="text: $data"></span>
        <button data-bind="click: $parent.removePlace">Remove</button>
    </li>
</ul>

 <script type="text/javascript">
     function MyViewModel() {
         var self = this;
         self.places = ko.observableArray(['London', 'Paris', 'Tokyo']);

         // The current item will be passed as the first parameter, so we know which place to remove
         self.removePlace = function(place) {
             self.places.remove(place)
         }
     }
     ko.applyBindings(new MyViewModel());
</script>

去除


函数MyViewModel（）{
var self=这个；
self.places=ko.observearray（[“伦敦”、“巴黎”、“东京]）；
//当前项将作为第一个参数传递，因此我们知道要删除哪个位置
self.removePlace=功能（位置）{
self.places.remove（放置）
}
}
应用绑定（新的MyViewModel（））；

我手头没有敲除/键入脚本设置来尝试此操作，但我会猜测，“this”已失去对函数中父类的引用

如果您查看knockout主页上的一个示例，您可以看到他们使用“self”变量来存储“this”引用。可能模板没有使用正确的“this”值调用函数。使用console.log查看“this”值是什么

<ul data-bind="foreach: places">
    <li>
        <span data-bind="text: $data"></span>
        <button data-bind="click: $parent.removePlace">Remove</button>
    </li>
</ul>

 <script type="text/javascript">
     function MyViewModel() {
         var self = this;
         self.places = ko.observableArray(['London', 'Paris', 'Tokyo']);

         // The current item will be passed as the first parameter, so we know which place to remove
         self.removePlace = function(place) {
             self.places.remove(place)
         }
     }
     ko.applyBindings(new MyViewModel());
</script>

去除


函数MyViewModel（）{
var self=这个；
self.places=ko.observearray（[“伦敦”、“巴黎”、“东京]）；
//当前项将作为第一个参数传递，因此我们知道要删除哪个位置
self.removePlace=功能（位置）{
self.places.remove（放置）
}
}
应用绑定（新的MyViewModel（））；

如果以这种方式引用视图模型中的函数，

此

将被删除覆盖

可以将视图模型中的函数定义为箭头函数。这样，

此

将继续引用视图模型类

因此，您可以更改：

removeVehicle(vehicle): void {
    this.vehicles.remove(vehicle);
}

致：

---

如果以这种方式引用视图模型中的函数，

此

将被敲除覆盖

可以将视图模型中的函数定义为箭头函数。这样，

此

将继续引用视图模型类

因此，您可以更改：

removeVehicle(vehicle): void {
    this.vehicles.remove(vehicle);
}

致：

removeVehicle = (vehicle) => {
    this.vehicles.remove(vehicle);
}