Question

我有以下UL列表：

 <li class="item" *ngFor="let lang of languages | orderBy: 'def'">{{lang.id}}</li>

orderBy是管道的地方：

import { Pipe, PipeTransform } from '@angular/core';
import * as _ from 'lodash';
@Pipe({
  name: 'orderBy'
})
export class OrderBy implements PipeTransform {
  transform(array: any[], orderBy: any) {
    return _.sortBy(array, orderBy)

  }
}

languages对象是：

[ { "id": 1, "code": "fr", "active": true, "def": 0, "hide": false }, { "id": 2, "code": "ru", "active": true, "def": 1, "hide": false } ]

正如您所见，此管道按属性"def"排序。在我的情况下，第一个元素li应为{ "id": 2, "code": "ru", "active": true, "def": 1, "hide": false }。

但我发现它没有开心。模板未呈现。

我查了一下：

var c  = _.sortBy([ { "id": 1, "code": "fr", "active": true, "def": 0, "hide": false }, { "id": 2, "code": "ru", "active": true, "def": 1, "hide": false } ],"def");

它返回了我的对象：

{id: 1, code: "fr", active: true, def: 0, hide: false}
{id: 2, code: "ru", active: true, def: 1, hide: false}

正如您所见，def: 1的元素不在第一位。

Answer 1

用户array.reverse

_.sortBy([ { "id": 1, "code": "fr", "active": true, "def": 0, "hide": false }, { "id": 2, "code": "ru", "active": true, "def": 1, "hide": false } ],"def").reverse()

如何通过管道Angular 4渲染UL列表？

1 个答案: