Question

我对angular js还是陌生的，老实说，我只知道前同事告诉我有关他传递给我的项目的信息。

我正在使用forkJoin从数据库中获取数据，因为我需要使用两组不同的数据来在Web上创建一个表。而且，我需要在同一网页上调用其他数据表。因此，forkJoin是我的同事建议的，并且使用ngOnInit（）很麻烦，因为并非所有数据都同时到达。

在（AngularJS sorting rows by table header）中，我发现在* .ts文件和 orderBy 中使用 $ scope 和 angular.module * .html文件中的 ng-repeat 。我试图使它正常工作，但似乎该示例使用的是硬编码表，而不是从数据库中调用数据。另外，在使用 ng-repeat 时，以下代码似乎无法识别 ng-repeat 。

<tr ng-repeat="data in myTable|orderBy:'index':false">
   <ng-container *ngIf="someConditions">
      <td>{{ data.index }}</td> //data not recognized
   </ng-container>
</tr>

我发现的第二种选择是排序，是通过 @ angular / material 导入的。但是，当我尝试部署该代码时，它给了我一个错误，该错误似乎与依赖项的版本有关。为了使我的同事的代码正常工作，他和我不得不检查主要依赖项的版本，现在所有这些都已同步。因此，我不想弄乱版本问题。

最后，我找到了一种将表加载到Web上后对其进行排序的方法，但这并不是我想要的。我希望该表可以随时随地单击标题以对行进行动态排序。那个帖子（或回答者）说不应使用订购管道。（Orderby with *ngFor array）

所以

是否可以使用 forkJoin 和 ngFor （我可以像ng-repeat一样使它工作）来实现标题点击排序？ p>
如果使用 angular.module 和 $ scope 更好，那么在同时调用所有表的同时如何使用它们（即我整合了

var app = angular.module('app',[]);

app.controller('myCtrl', function($scope) {
   $scope.orderBy = 'index';
   ...
   $scope.data = {
      myData: [{
         ...
      }]
   };
});

插入* .ts文件？）

Answer 1

尝试使用

<tr ng:repeat="row in body.$orderBy(sort.column, sort.descending)">
    <td>{{row.a}}</td>
    <td>{{row.b}}</td>
    <td>{{row.c}}</td>
</tr>

scope.sort = {
    column: 'b',
    descending: false
};

scope.selectedCls = function(column) {
    return column == scope.sort.column && 'sort-' + scope.sort.descending;
};

scope.changeSorting = function(column) {
    var sort = scope.sort;
    if (sort.column == column) {
        sort.descending = !sort.descending;
    } else {
        sort.column = column;
        sort.descending = false;
    }
};

角度单击表标题以对行进行排序

1 个答案: