javascript - sortBy 不对指令表中的项目进行排序

Question

HTML:

<select class="form-control" ng-model="sortBy">
  <option value="createdAt"><strong>Date</strong></option>
  <option value="ProgressStateNumber"><strong>Progress</strong></option>
  <option value="adminUsername"><strong>adminUsername</strong></option>
</select>

<tbody>
  <tr
    reportrowgroup
      ng-repeat="report in reportTree track by $index | orderBy: sortBy"
      report="report"
    >

指令:

  .directive('reportrowgroup', function () {
    return {
      restrict: 'EA',
      template:
        '<td>{{report.createdAt | date:"yyyy-MM-dd HH:mm"}}</td>'+
        'MORE HTML'
        scope: {
            report: '='
        },
        controller: function() {
        },
        link: function(scope,elem,attr,ctrl) {
      }
        }
    }
})

一切正常，除了当我在 select 中选择 createdAt 时，表格不按 createdAt 排序。

可能是什么问题？

Answer 1

您的 reportrowgroup 指令正在创建一个新的 scope，因此缺少对同一 sortBy 变量的引用。尝试将 sortyBy 包装在一个对象中。

<!-- markup -->
<select class="form-control" ng-model="input.sortBy">

// Code
angular.module('myApp').controller('MyController', function($scope) {
  $scope.input = {
    sortBy: 'default-value-goes-here'
  };
});

查看这个笨蛋:http://plnkr.co/edit/MmjuaLfvVnOQb0Ngz0dI?p=preview