我正在通过网络创建一个多人游戏,所以我必须对网络事件做出反应。
我有这个简单的代码,但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');
答案 0 :(得分:69)
您必须使用remove function:
self.removePlayer = function (Name) {
self.players.remove(function(player) {
return player.name == Name;
});
}
<强> 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 强>
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');
答案 1 :(得分:12)
工作删除功能:
self.removePlayer = function (name) {
self.players.remove(function(player) {
return player.name == name
});
}
答案 2 :(得分:2)
你的代码很好,除了你有2个错误:
if (self.players()[i].name == Name) console.log(i);
self.players().splice(i, 1);
首先在这里你执行2行所以要执行它们你需要使用{}
所以用以下代码替换它:
if (self.players()[i].name == Name) {
console.log(i);
self.players.splice(i, 1);
}
第二次使用splice
您需要使用()
调用您的可观察数组,以便按以下方式使用它:
self.players.splice(i, 1);
<强> Working Demo 强>
答案 3 :(得分:0)
如果您将视图模型添加到这样的玩家数组中:
self.addPlayer = function (Name, QueuePos, Score) {
self.players.push(new PlayerVM(Name, QueuePos, Score)));
}
然后您可以像这样删除播放器对象:
self.removePlayer = function (player) {
self.players.remove(player);
}
或者在播放器vm中:
parentVM.players.remove(self);
答案 4 :(得分:0)
根据淘汰网站的最佳信息来源:https://knockoutjs.com/documentation/observableArrays.html
您可以直接使用remove方法- self.players.remove(self.players()[i]);