0

我认为这个问题之前已经问过很多次了。我已经在我的角度项目中实现了 DatePipe，格式正确，只是它显示了当前日期，这不是我想要的，也不是我从休息服务收到的日期。我从 REST 服务 (createdOn) 中得到一个过去的日期。这是我的代码：

TS

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

export class PostComponent implements OnInit {
post: Postpayload;
newDateFormat: string;
constructor(private router: ActivatedRoute,
          private postService: PostService, public datepipe: DatePipe) {
            this.post = {
              createdOn: new Date()
            };
            this.newDateFormat = this.datepipe.transform(this.post.createdOn, 'dd-MM-yyyy');
         }
 }

后有效载荷

export class Postpayload {
id: number;
content: string;
title: string;
username: string;
createdOn: Date;

}

ngOnInit(): void {
this.router.params.subscribe( params => {
  this.permaLink = params.id;
});
  this.postService.getPost(this.permaLink).subscribe( (  data:Postpayload) 
  => {
  this.post = data;
   }, (err: any) => {
    console.log(err);
    console.log('failure response');
   });
  }

HTML

<p>{{ newDateFormat }}</p>

这会导致我获得当前日期或今天的日期，我的问题是如何格式化从我的休息 Api 服务调用中收到的 this.post.createdOn 的日期。当我不使用 DatePipe 时，它​​会显示正确的日期，但我不想要这种默认的完整样式日期格式。

邮政服务

getPost(permaLink: number): Observable<Postpayload> {
return this.http.get<Postpayload>(this.url + 'get/' + permaLink);
}
4

3 回答 3

1

我知道你在课堂上做日期管道，但你能把它移到你的 dom 吗？

<p>{{ newDateFormat | date:"dd-MM-yyyy" }}</p>
于 2021-04-03T12:21:29.963 回答
0

您没有使用服务中的日期，但您正在实例化new Date实例。您在这里所做的正是预期的new Date()- 设置当前日期。实际上，要从 Service 获取数据，您应该向我们展示您的 postService 是如何实现的。所以调用可能是这样的，假设getPost从服务返回Observable：

         postService.getPost().subscribe( (postPayload) => {
                this.post = {
                   createdOn: postPayload.createdOn
                };
                this.newDateFormat =this.datepipe.transform(this.post.createdOn, 'dd-MM-yyyy');
          }
于 2021-04-03T11:38:30.073 回答
0

所以我已经解决了我的问题，对于那些仍然感兴趣的人。

我决定直接在 HTML 中使用 DatePipe。

{{ post.createdOn | 日期：'mediumDate'}}

在 component.ts 中，我根本不使用 new Date() 实例化 createdOn。我还将 Postpayload 中的 createdOn 更改为键入任何内容。

在我的 Web 应用程序的后端，我通过在 createdOn 字段上添加 @JsonFormat(pattern="MM-dd-yyyy") 来改进 json，如果我不使用 JsonFormat，则 DatePipe 将无法正确格式化。

于 2021-04-05T14:47:30.887 回答