Question

我试图对团队进行排序＆＃39;按降序排列，我不理解为什么我的排序不起作用？

<!-- ko foreach: teams -->
<span data-bind="text: name"></span> <span data-bind="text: points"></span>
<br/>
<!-- /ko -->




function Point(label, value) {
  var self = this;
  self.label = ko.observable(label);
  self.value = ko.observable(value);
}

function Team(name) {
  var self = this;
  self.name = ko.observable(name);
  self.rank = ko.observable(0);
  self.points = ko.observable(0);
}

function AppViewModel() {
  var self = this;
  self.teams = ko.observableArray([
    new Team('red'),
    new Team('blue'),
    new Team('yellow'),
    new Team('green'),
  ]);
  self.points = ko.observableArray([
    new Point('1st', 20),
    new Point('2nd', 10),
    new Point('3rd', 5)
  ]);

  self.tester = function() {
    ko.utils.arrayForEach(self.teams(), function(team) {
      //get team ranking and then find it in points
      team.points(
        self.points()[team.rank() - 1].value()
      )
    });
    //sort by highest points
    self.teams(
      self.teams().sort(function(left, right) {
        return left.points == right.points ? 0 : (left.points < right.points ? 1 : -1)
      })
    );
  };
}

var vm = new AppViewModel();
ko.applyBindings(vm);

vm.teams()[0].rank(2);
vm.teams()[1].rank(1);
vm.teams()[2].rank(3);
vm.teams()[3].rank(4);

vm.tester();

Answer 1

排序不适用于这两个错误。

第一个是此代码：

self.points()[team.rank() - 1].value()

点可观察数组仅包含3个值，而团队等级可以为4，因此self.points()[3].value()将产生错误。

修复将在点数组中添加另一个值，如：new Point('4th', 0)，或者如果索引超出范围，您可以找到另一种方法，如陷阱。

第二部分是这部分（排序）：

return left.points == right.points ? 0 : (left.points < right.points ? 1 : -1)

请记住，点是可观察的，因此您需要将其称为函数

return left.points() == right.points() ? 0 : (left.points() < right.points() ? 1 : -1)

或者你甚至可以使用你提供的等级对其进行排序

return left.rank() - right.rank()

这是您提供的修改过的小提琴。 https://jsfiddle.net/56jgehjw/

Answer 2

三件事：

在找到arrayForEach的{{1}}时，您错过了第四名，使您的应用崩溃在points内。 在发布在线问题之前，请务必检查控制台是否有错误; - ）
您正在比较 observables ，而不是它们的值。您需要调用teams()[4]和left.points来获取其值。
right.points方便地拥有observableArray函数本身，它将对基础数组进行排序;

简而言之，您需要将sort更改为：

points

你的self.points = ko.observableArray([ new Point('1st', 20), new Point('2nd', 10), new Point('3rd', 5), new Point('4th', 0) ]);对此：

tester

顺便说一下，你甚至可以简化你的排序：

self.tester = function() {
  ko.utils.arrayForEach(self.teams(), function(team) {
    //get team ranking and then find it in points
    team.points(
      self.points()[team.rank() - 1].value()
    )
  });
  //sort by highest points
  self.teams.sort(function(left, right) {
    return left.points() == right.points() ? 0 : (left.points() < right.points() ? 1 : -1)
  });
};

things will work as intended。

在knockoutjs中按降序排序点总计

2 个答案: