Datepipe angular 2没有显示正确的resuts

时间:2017-04-05 17:49:16

标签: angular date-pipe

以下是我的代码。使用日期管道中的angular 2 build将时间戳转换为正确的日期格式。

import { Component } from '@angular/core';

@Component({
selector: 'my-app',
template:`<h1>My First Angular 2 App</h1>
<p>{{test | date: 'dd/MM/yyyy'}} - format: dd/MM/yyyy</p>`
})

export class AppComponent { 
test : Date = '2017-04-30T23:59:59';
}

输出: 2017年1月5日 - 格式:dd / MM / yyyy

但我期待30/04/2017作为我的ooutput

2 个答案:

答案 0 :(得分:0)

我的解决方案如下工作

//our root app component
import {Component, NgModule, VERSION} from '@angular/core'
import {BrowserModule} from '@angular/platform-browser'

@Component({
  selector: 'my-app',
  template: `
    <div>
      <h2>Hello {{name}}</h2><br>
      <h5>{{test | date: 'dd/MM/yyyy'}}</h5>
    </div>
  `,
})
export class App {
  name:string;
   test : Date = new Date('2017-04-30T23:59:59');
  constructor() {
    this.name = `Angular! v${VERSION.full}`;
   console.log(this.test)
  }
}

<强> LIVE DEMO

更新:

 getExcatDate(string){
    let year=new Date(this.name).getYear();
    let month=new Date(this.name).getMonth();
    let date=new Date(this.name).getDate();

    let local= (date.toString().length===1 ?  '0' +date : date) + '/' +
                (month.toString().length===1 ?  '0' +month : month) 
              + '/' +  year.toString().substring(1);
    console.log(local)
    return local;
  }

使用上述方法获取确切的日期,因为Pankaj说日期管道不适用于您的情况。演示已更新

答案 1 :(得分:0)

我认为您遇到了时区问题。

来自https://www.w3schools.com/js/js_dates.asp

  

设置日期时,不指定时区,JavaScript会   使用浏览器的时区。

     

获取日期时,如果没有指定时区,结果为   转换为浏览器的时区。

当我测试只是在jsFiddle的构造函数中创建一个带有字符串的日期并且控制台将其记录下来时,我得到的时间比我定义的时间晚了5个小时,这与GMT相对应。

尝试使用指定的时区设置日期:

test : Date = new Date('2017-04-30T23:59:59Z');