如何使用 AngularJS 而不是在查询子句中按两列的差异对 table 进行排序？

Question

这是一些代码。我刚刚发布了主要 html table 我需要知道如何对我的 table（字段：vote_value 和 vote_dismissed_value）进行排序。

排序需要如下：按 vote_value - vote_dismissed_value 排序。

怎么做？使用 AngularJS 而不是使用 sql 查询子句。

谢谢

table.gridtable {
  font-family: verdana, arial, sans-serif;
  font-size: 11px;
  color: #333333;
  border-width: 1px;
  border-color: #666666;
  border-collapse: collapse;
}
table.gridtable th {
  border-width: 1px;
  padding: 8px;
  border-style: solid;
  border-color: #666666;
  background-color: #dedede;
}
table.gridtable td {
  border-width: 1px;
  padding: 8px;
  border-style: solid;
  border-color: #666666;
  background-color: #ffffff;
}

the html table that needs to be sorted
<div>
  <table class="gridtable" ng-show="entity.currentFilter.id">
    <tbody>
      <tr>
        <th>#</th>
        <th>Name</th>
        <th>Vote Value</th>
        <th>Vote Dismissed Value</th>
        <th>Vote Total</th>
        <th>is Winner</th>
      </tr>
      <!-- NNN Angular repeat -->
      <tr ng-repeat="element in entity.currentPage.items | orderBy:['-vote_value']">
        <td>{{ tag.ng("$index + 1") }}</td>
        <td>{{ tag.ng("element.name") }}</td>
        <td class="text-danger">{{ tag.ng("element.vote_value") }}</td>
        <td class="text-warning">{{ tag.ng("element.vote_dismissed_value") }}</td>
        <td class="text-success">{{ tag.ng("element.vote_value - element.vote_dismissed_value") }}</td>
        <td>
          <div class="iphone-toggle-buttons">
            <label>
              <input type="checkbox" ng-model="element.state_win" ng-true-value="1" ng-false-value="0" ng-change="updateCurrentCompetitorState(element)">
              <span> 
                                                </span>
            </label>
          </div>
        </td>
      </tr>
    </tbody>
  </table>
</div>

Answer 1

好的，我明白了...

对我有用的答案是更改 orderBy 语句。像这样：

<table class="table" ng-show="entity.currentFilter.id">
  <thead>
    <tr>
      <th>#</th>
      <th>Name</th>
      <th>Vote Value</th>
      <th>Vote Dismissed Value</th>
      <th>Vote Total</th>
      <th>is Winner</th>
    </tr>
  </thead>
  <tbody>
    <!-- NNN Angular repeat -->
    <tr ng-repeat="element in entity.currentPage.items | orderBy:myCustomSortFunction:true">
      <td>{{ tag.ng("$index + 1") }}</td>
      <td>{{ tag.ng("element.name") }}</td>
      <td class="text-danger">{{ tag.ng("element.vote_value") }}</td>
      <td class="text-warning">{{ tag.ng("element.vote_dismissed_value") }}</td>
      <td class="text-success">{{ tag.ng("element.vote_value - element.vote_dismissed_value") }}</td>
      <td>
        <div class="iphone-toggle-buttons">
          <label>
            <input type="checkbox" ng-model="element.state_win" ng-true-value="1" ng-false-value="0" ng-change="updateCurrentCompetitorState(element)">
            <span> 
                                                </span>
          </label>
        </div>
      </td>
    </tr>
  </tbody>
</table>

before: orderBy:['-vote_value'] AND after: orderBy:myCustomSortFunction:true

而 javascript 函数是：

$scope.myCustomSortFunction = function(Element) {
  return Element.vote_value - Element.vote_dismissed_value;
}

工作jsFiddle 已找到答案 here

如何使用 AngularJS 而不是在查询子句中按两列的差异对 table 进行排序？

How to sort a table by difference of two columns using AngularJS and not in a query clause?

javascript

php

model-view-controller

angularjs