简体   繁体   English

在数据绑定foreach中仅对一次计算的分类敲除

[英]Sort Knockout's computed only once in data-bind foreach

so here my problem is that I want knockout's foreach to display my computed array of objects in descending order according to one value per object (totalTTC of Order). 所以在这里我的问题是我希望敲除的foreach根据每个对象一个值(Order的totalTTC)以降序显示我计算的对象数组。 And I dont want this order to change even if the totalTTC in an order change when user change stuff. 而且我不希望此顺序发生更改,即使用户更改内容时订单中的totalTTC发生了变化。 But the sorting is updating each time a change is made and I dont know how to disable this. 但是每次进行更改时,排序都会更新,我不知道如何禁用此功能。 Here is my computed: 这是我的计算结果:

appViewModel.orders = ko.computed(() -> (
  orders = []
  # Check if seller of this shoppingCartLine exists
  appViewModel.shoppingCartLines().forEach((shoppingCartLine) ->
  existingOrder = null
  orders.forEach((order) ->
    if order.seller? and order.seller.id() == shoppingCartLine.ad.ownerJson.id()
      existingOrder = order
  )
  # If it exits add it to its shoppingCartLines array
  if existingOrder?
    existingOrder.shoppingCartLines.push(shoppingCartLine)
    return
  # Otherwise create a new order from this shoppingCartLine
  else
    seller = shoppingCartLine.ad.ownerJson
    shoppingCartLines = ko.observableArray([shoppingCartLine])

    order = new Order(seller, shoppingCartLines, appViewModel.freeShippingFeesThreshold)
    orders.push(order)
    return
  )
  return orders
))

And here is my html: 这是我的html:

<div data-bind="foreach: {data: orders().sort(function (o, r) { return r.totalHT() > o.totalHT() ? 1 : -1 }), as: 'order'}">

I just want the sorting function to be triggered once. 我只希望排序功能被触发一次。

Since you said you do not need knockout to update when orders are add/removed, and don't need to update the sorting, orders does not need to be an observable. 由于您说的是添加/删除订单时不需要敲除更新,也不需要更新排序,因此订单不必是可观察的。

Personally I'd also sort it in the viewModel. 我个人也会在viewModel中对其进行排序。 I like the markup to contain as little code as possible. 我希望标记包含尽可能少的代码。

  appViewModel.orders = computeOrders().sort(function (o, r) { return r.totalHT() > o.totalHT() ? 1 : -1 });

  function computeOrders() {
      # Check if seller of this shoppingCartLine exists
      appViewModel.shoppingCartLines().forEach((shoppingCartLine) ->
      existingOrder = null
      orders.forEach((order) ->
        if order.seller? and order.seller.id() == shoppingCartLine.ad.ownerJson.id()
          existingOrder = order
      )
      # If it exits add it to its shoppingCartLines array
      if existingOrder?
        existingOrder.shoppingCartLines.push(shoppingCartLine)
        return
      # Otherwise create a new order from this shoppingCartLine
      else
        seller = shoppingCartLine.ad.ownerJson
        shoppingCartLines = ko.observableArray([shoppingCartLine])

        order = new Order(seller, shoppingCartLines, appViewModel.freeShippingFeesThreshold)
        orders.push(order)
        return
      )
      return orders
  }

HTML: HTML:

<div data-bind="foreach: orders">

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM