?
Solved

date format angularjs2

Posted on 2016-10-04
16
Medium Priority
?
374 Views
Last Modified: 2016-11-17
My date format returns
/Date(1326258000000)/

Open in new window

in json.
st.Date  | date:'dd/MM/yyyy'

Open in new window

 does not  format my date. How can I in angularjs2
0
Comment
Question by:Seven price
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 6
  • 5
  • 4
16 Comments
 
LVL 58

Expert Comment

by:Julian Hansen
ID: 41828490
Can we see a context?
0
 
LVL 9

Author Comment

by:Seven price
ID: 41828560
Well maybe in angular2 I need to create a pipe filter for the date format as well. Not like angular 1.
Not sure the bigger picture you would like to see.


<table>
<tr *ngFor='#t of list'>
 <td>{{t.Name}}</td>
 <td>{{ dlist.NotInvestedDate | date: 'dd/MM/yyyy'}}</td>
</tr>
</table>

Open in new window

Using a angularjs Service  that loads from mvc Controller.
Returns Json format data.
0
 
LVL 25

Expert Comment

by:Kyle Hamilton
ID: 41828723
"/Date(1326258000000)/"

your service returns this string, exactly like that? or just the datestamp?
0
Get real performance insights from real users

Key features:
- Total Pages Views and Load times
- Top Pages Viewed and Load Times
- Real Time Site Page Build Performance
- Users’ Browser and Platform Performance
- Geographic User Breakdown
- And more

 
LVL 58

Expert Comment

by:Julian Hansen
ID: 41828744
What does this produce
{{dlist}}
0
 
LVL 9

Author Comment

by:Seven price
ID: 41829032
It returns it just like that.
0
 
LVL 9

Author Comment

by:Seven price
ID: 41829034
julian typo it suppose to be t not dlist
0
 
LVL 25

Expert Comment

by:Kyle Hamilton
ID: 41829162
if that's the exact string, then you need to extract the timestamp before passing to the date filter.

probably best with a regular expression.

var mre = /\d+/g;
d = parseInt("/Date(1326258000000)/".match(mre,$1))

Open in new window


returns
1326258000000

Open in new window


you can write a custom filter that gets processed before the date filter, or you can parse your data in the controller, or service. There are many ways to skin this cat.
0
 
LVL 58

Expert Comment

by:Julian Hansen
ID: 41829292
julian typo it suppose to be t not dlist
Line 4 ????
<td>{{ dlist.NotInvestedDate | date: 'dd/MM/yyyy'}}</td>

Open in new window

We need to see what is in dlist
0
 
LVL 9

Author Comment

by:Seven price
ID: 41830176
Example

in angular1 I could parse the data JSON.parse(value); when returning from api  because the data returned "{\"_body\":\"[{\\\"ID\\\":33,\\\"Nam\\\":\\\"SusCampbell\\\"NotInvestedDate":"2012-01-11T00:00:00"",

    getboard(): Observable<Idata[]> {
        return this._http.get(this._dashUrl)
            .map((response: Response) => <Idata[]>response.json())
          //  .do(data => console.log('All: ' + JSON.stringify(data)))
            .catch(this.handleError);
    }


Julian I see.
nothing in dlist. ok. please.
<td>{{ t.NotInvestedDate | date: 'dd/MM/yyyy'}}</td>


Kyle not sure to make this happen in a angularjs2 service?
0
 
LVL 58

Expert Comment

by:Julian Hansen
ID: 41830210
Is that your returned data?
how are you getting
Date(1326258000000)
From that.
0
 
LVL 25

Expert Comment

by:Kyle Hamilton
ID: 41830246
you can provide multiple filters in your expression.

{{ t.NotInvestedDate | my_regex_filter | date:'dd/MM/yyyy'}}

write a filter that takes your string as input and returns the timestamp using the regular expression
0
 
LVL 25

Expert Comment

by:Kyle Hamilton
ID: 41830254
but like Julian pointed out, your API appears to be returning a date string not what you stated earlier.

what is the exact value rendered by t.NotInvestedDate?
0
 
LVL 25

Accepted Solution

by:
Kyle Hamilton earned 2000 total points
ID: 41830298
Here is blog post describing how to make filters in angular2. This is different from 1.x:

http://jilles.me/ng-filter-in-angular2-pipes/

import {Pipe} from 'angular2/core';

// Tell Angular2 we're creating a Pipe with TypeScript decorators
@Pipe({
  name: 'DatePipe'
})
export class DatePipe {
 // Transform is the new "return function(value, args)" in Angular 1.x
  transform(value, args?) {
    var re = /\d+/g;
    d = parseInt("/Date(1326258000000)/".match(re,$1))
    return d
  }

}

Open in new window

0
 
LVL 9

Author Comment

by:Seven price
ID: 41830815
thanks I already thought this was the fix. thanks
0
 
LVL 9

Author Closing Comment

by:Seven price
ID: 41891978
thanks
1

Featured Post

Optimize your web performance

What's in the eBook?
- Full list of reasons for poor performance
- Ultimate measures to speed things up
- Primary web monitoring types
- KPIs you should be monitoring in order to increase your ROI

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Having worked on larger scale sites, we found out that you are bound to look at more scalable solutions to integrating widgets, code snippets or complete applications and mesh them into functional sites, in any given composition. To share some of…
You have this traditional web application that refreshes the whole page each time you navigate and you think it's a good time to convert it to a Single-Page approach. What should you know in advance? Read on, I'll guide you through it.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

770 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question