Угловая труба - сортировка номеров - PullRequest
1 голос
/ 03 ноября 2019

Очень стараюсь понять, как сортировать числа. Я имею дело с циклом ngFor, и я хотел бы отсортировать некоторые из моих значений. Я использую номера временного кода (фильм / ТВ) без двоеточий. Числа типа

01002000 01003000 01000012

Я бы хотел отсортировать их в порядке asc, используя трубу. На мой взгляд, я не могу заставить его работать

Я создал трубу и пытаюсь


export class SortTimecodePipe implements PipeTransform {
  transform(value, direcion): any {

    return value.sort();
  }
}

Я также знаю, что сортировка имеет дело со строкамипоэтому я также попытался передать функции сортировки параметр.


export class SortTimecodePipe implements PipeTransform {
  transform(value, direcion): any {
    function compare(a, b) {
      return a - b;
    }

    return value.sort(compare);
  }
}

Ни одна из этих опций не работает. Сортировка не происходит.

Можете ли вы помочь?

------- РЕДАКТИРОВАТЬ -------

Данные, которые поступаютназад на самом деле массив объектов, они выглядят так:

[
{"timecodeIn": 01000020, "timecodeOut": 01000010, "Reason": "Alt Line", "Line": "Hey there"},
{"timecodeIn": 01000005, "timecodeOut": 01000007, "Reason": "Extra", "Line": "You"}
]

I'm tyring to ngFor this array of objects, sorted by the 'timecodeIn' property.

Thanks for the note on sorting numbers like this over strings, I can see how it would fail now. Also, wondering if sorting in the component is better than the view (pipe)

1 Ответ

0 голосов
/ 03 ноября 2019

Проверьте стекблиц здесь . Возможно, у вас есть опечатка или какая-то другая проблема, но, учитывая, что речь идет о строках:

numbersStr = ['01002000', '01003000', '01000012'];

или числах

numbers = [1002000, 1003000, 1000012];

Тогда в html

<div>
  <h4> Sorting strings array </h4>
  <ul>
    <li *ngFor="let number of numbersStr | sortStringsPipe">{{number}}</li>
  </ul>
  <h4> Sorting number array </h4>
  <ul>
     <li *ngFor="let number of numbers | sortPipe"> 
       {{number}}</li>
  </ul>
<div>

Следующий фильтр работает отлично.

import {PipeTransform,Pipe} from '@angular/core'

@Pipe({
  name:'sortStringsPipe',
  pure:false
})
export class ShortStringsPipe implements PipeTransform {


transform(value:any[]):any{
  return value.sort();
}

}
...