How to filter a unix timestamp

Question

so basically I have an ionic mobile application which has a search button or filter feature. I already figure out how to filter the words but the problem here is that the date since it is a timestamp and is displayed in the app through angular date filter which is

<p>at {{item.fromDate | date:'mediumDate'}}</p>

Here's a picture for you to picture out.

Data that is displayed. As you can see the fromDate and toDate are Unix timestamp

so the problem here is that i wanted to do a search feature for dates but I'm having a hard time as to how since it is a timestamp.

here's is my code for the filter

getItems(ev: any) {
  console.log("awdaw");
  console.log("awdaw",this.ListOfitems);
  console.log("otin");

  this.ListofItems();
  let val = ev.target.value;
  if (val && val.trim() != '') {
    this.ListOfitems = this.ListOfitems.filter((ListOfitem) => {
      return (ListOfitem.fromAddress.toLowerCase().indexOf(val.toLowerCase()) > -1||
        ListOfitem.toAddress.toLowerCase().indexOf(val.toLowerCase()) >-1) ;


    })
  }

}

muZk · Answer 1 · 2018-02-07T14:18:09.393

0

What you can do is use the mediumDate filter in your filter function.

For this, you have to use DatePipe:

import { DatePipe } from '@angular/common';

You have to inject this in your class. You can see how in this answer.

Then just:

this.datePipe.transform(ListOfItem.fromDate, 'mediumDate')
this.datePipe.transform(ListOfItem.toDate, 'mediumDate')

It should return the same string that you are showing

So the additional conditions you have to add to your filter is:

this.datePipe.transform(ListOfItem.fromDate, 'mediumDate').toLowerCase().indexOf(val.toLowerCase()) > -1
this.datePipe.transform(ListOfItem.toDate, 'mediumDate').toLowerCase().indexOf(val.toLowerCase()) > -1

By the way, you can do something like this:

const val = (ev.target.value || '').toLowerCase();

So you don't repeat yourself by writing val.toLowerCase()

edited Feb 07 '18 at 14:18

answered Feb 07 '18 at 13:56

muZk

2,908
1
21
22

hello, may i ask what $filter is? – Jennica Feb 07 '18 at 14:03
because im using typescript hehe – Jennica Feb 07 '18 at 14:07
In angularjs (v1) $filter can be injected in your controllers/services/factories to call the same filters that you use in views. Are you using angular2+ right? – muZk Feb 07 '18 at 14:08
yes, i understand the logic but im havin a hard on how to use $filter. without it (ListOfItem.fromDate, 'mediumDate') thiss wont work since this is the html binding format. when using filter it gives me $filter not defined. – Jennica Feb 07 '18 at 14:15
i think htis is the best way but im having a hard time on $filter. hehe sorry im beginner to angular – Jennica Feb 07 '18 at 14:16
Updated my reply to angular2+. My old answer was using angular version 1.x, now it uses angular2+ – muZk Feb 07 '18 at 14:19
hi. can i ask whats the possible reason for cannot read property of transform undefined? – Jennica Feb 07 '18 at 14:37
imported import { DatePipe } from '@angular/common'; then declared datepipe: DatePipe; – Jennica Feb 07 '18 at 14:38
Are you injecting it? Another way (not recommended but that should work) is to use: `let toDateText = new DatePipe().transform(ListOfItem.toDate, 'mediumDate');` – muZk Feb 07 '18 at 15:41
Or define a local variable `const datePipe = new DatePipe()` and then just `datePipe.transform(ListOfItem.toDate, 'mediumDate')` – muZk Feb 07 '18 at 15:42

How to filter a unix timestamp

1 Answers1