javascript - 如何根据每个数组中的某个项目对 Observable 数组进行排序

Question

我有一个 Observable 数组，里面有数组，每个数组中都有一个名为“时间”的项目。我将如何对我的可观察数组中的数组进行排序，以便它们根据项目的值从低到高按顺序排列。这些值采用时:分:秒格式。

function viewModel() {
  var self = this;
  
  self.myObservable = ko.observableArray([
  {time: "01:00:00", name: 'frank'},
  {time: "05:30:00", name: 'bob'},
  {time: "03:00:00", name: 'bill'},
  {time: "00:00:21", name: 'john'},
  {time: "00:12:00", name: 'paul'}
  ])
}

Answer 1

Knockout 有 built-in methods对于 observableArray 其工作类似于 Array.prototype .你可以sort通过使用 localeCompare

function viewModel() {
  var self = this;

  self.myObservable = ko.observableArray([
      { time: "01:00:00", name: 'frank' },
      { time: "05:30:00", name: 'bob' },
      { time: "03:00:00", name: 'bill' },
      { time: "00:00:21", name: 'john' },
      { time: "00:12:00", name: 'paul' }
    ]);

  self.sort = function() {
    self.myObservable.sort((a, b) => a.time.localeCompare(b.time))
  }
}

ko.applyBindings(new viewModel)

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>

<!-- ko foreach: myObservable -->
  <span data-bind="text: time"></span><br>
<!-- /ko -->

<button data-bind="click: sort">Sort</button>