Angular2日期管道显示完整日期

时间:2017-02-24 09:22:08

标签: angular typescript

我使用以下内容显示日期

 <p><i class="  zmdi zmdi-calendar icon icon--white-icon "></i>{{event?.date.start | date:'yMMMMEEEEd'}}</p>

显示日期如下,

Saturday, March 18, 2017

我也需要上面的时间。我该如何更换过滤器?

预期输出

2017年3月18日星期六下午11:29:30

2 个答案:

答案 0 :(得分:2)

你试过这个:

  <p>
       <i ..."></i>
       {{event?.date.start | date:'EEEE, MMMM dd, y, hh:mm:ss a'}}
  </p>

here is a link to a plunkr that allows you to play with data pipes

答案 1 :(得分:2)

我刚试了这个并且工作正常

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

@Component({
  selector: 'my-home',
  template: `

  {{theDate | date:'EEEE, MMMM d, y, H:mm:s a'}} <!-- Output is Friday, February 24, 2017, 12:06:47 PM-->

  `
})
export class HomeComponent implements OnInit {
  theDate = new Date();

  constructor() {

  }

}

out是Friday, February 24, 2017, 12:06:47 PM

所以基本上在你的情况下你应该有

<p>
    <i class="  zmdi zmdi-calendar icon icon--white-icon "></i>                  
    {{event?.date.start | date:'EEEE, MMMM d, y, H:mm:s a'}}
</p>

Plunker:http://plnkr.co/edit/1xhyem4MDUhHSTlIVg0E