Html 从 Knockout.JS 中的数组中删除特定元素
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/17630350/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Remove specific element from array in Knockout.JS
提问by NoWhereToBeSeen
I am creating a multiplayer game over network so I have to react on network events.
我正在通过网络创建多人游戏，所以我必须对网络事件做出反应。
I have this simple code, but the removePlayer method doesnt work. The addPlayer() works fine.
我有这个简单的代码，但是 removePlayer 方法不起作用。addPlayer() 工作正常。
<table id="userlist2" class="tablesorter" cellspacing="0">
<thead>
<tr>
<th>Name</th>
<th>Queue</th>
<th>Points</th>
</tr>
</thead>
<tbody data-bind="foreach: players">
<tr>
<td data-bind="text: name"></td>
<td data-bind="text: queue"></td>
<td data-bind="text: score"></td>
</tr>
</tbody>
</table>
function PlayerViewModel() {
var self = this;
self.players = ko.observableArray();
self.addPlayer = function (Name, QueuePos, Score) {
self.players.push({
name: Name,
queue: QueuePos,
score: Score
});
}
self.removePlayer = function (Name) {
for (var i = 0; i < self.players().length; i++) {
if (self.players()[i].name == Name) console.log(i);
self.players().splice(i, 1);
}
}
}
players = new PlayerViewModel();
ko.applyBindings(players);
players.addPlayer('Player1', '0', '0');
players.addPlayer('Player2', '0', '0');
players.removePlayer('Player2');
Heres the http://jsfiddle.net/xseTc/
回答by Damien
You have to use the remove function:
您必须使用删除功能：
self.removePlayer = function (Name) {
self.players.remove(function(player) {
return player.name == Name;
});
}
html
html
<table id="userlist2" class="tablesorter" cellspacing="0">
<thead>
<tr>
<th>Name</th>
<th>Queue</th>
<th>Points</th>
</tr>
</thead>
<tbody data-bind="foreach: players">
<tr>
<td data-bind="text: name"></td>
<td data-bind="text: queue"></td>
<td data-bind="text: score"></td>
</tr>
</tbody>
</table>
javascript
javascript
function PlayerViewModel() {
var self = this;
self.players = ko.observableArray();
self.addPlayer = function (Name, QueuePos, Score) {
self.players.push({
name: Name,
queue: QueuePos,
score: Score
});
}
self.removePlayer = function (Name) {
self.players.remove(function(player) {
return player.name == Name;
});
}
}
players = new PlayerViewModel();
ko.applyBindings(players);
players.addPlayer('Player1', '0', '0');
players.addPlayer('Player2', '0', '0');
players.removePlayer('Player2', '0', '0');
回答by Giannis
Working remove function:
工作删除功能：
self.removePlayer = function (name) {
self.players.remove(function(player) {
return player.name == name
});
}
回答by ebram khalil
your code is fine except 2 error you have:
您的代码很好，除了您有 2 个错误：
if (self.players()[i].name == Name) console.log(i);
self.players().splice(i, 1);
first here you are executing 2 lines so to execute them both you need to use {}so replace it with:
首先在这里你正在执行 2 行，所以要执行它们，你需要使用它们，{}因此将其替换为：
if (self.players()[i].name == Name) {
console.log(i);
self.players.splice(i, 1);
}
second to use spliceyou done need to call your observable array with ()so you to use it as following :
第二次使用splice你需要调用你的可观察数组，()以便你使用它如下：
self.players.splice(i, 1);
回答by Andrew
If you add view models to the array of players like this:
如果你像这样将视图模型添加到玩家数组中：
self.addPlayer = function (Name, QueuePos, Score) {
self.players.push(new PlayerVM(Name, QueuePos, Score)));
}
Then you can remove the player object like this:
然后你可以像这样删除玩家对象：
self.removePlayer = function (player) {
self.players.remove(player);
}
Or from within the player vm:
或者从玩家虚拟机中：
parentVM.players.remove(self);
回答by Vishal Grover
As per the best source from knockout site : https://knockoutjs.com/documentation/observableArrays.html
根据淘汰赛网站的最佳来源：https: //knockoutjs.com/documentation/observableArrays.html
You can use remove method direct -- self.players.remove(self.players()[i]);
您可以直接使用 remove 方法 -- self.players.remove(self.players()[i]);
