在后端使用spring-boot,我有一个名为干预的实体:
import com.fasterxml.jackson.annotation.JsonBackReference;
import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
import org.springframework.format.annotation.DateTimeFormat;
import javax.persistence.*;
import java.io.Serializable;
import java.util.Date;
@Entity
@Data
@AllArgsConstructor
@NoArgsConstructor
public class Intervention implements Serializable {
@Id @GeneratedValue
private Long Id;
private String objet;
@DateTimeFormat(pattern = "dd/MM/yyyy")
private Date date;
@Column(columnDefinition="BOOLEAN DEFAULT false")
private boolean valid;
@ManyToOne
@JoinColumn(name = "Id_AppUser")
@JsonBackReference(value="appuser-intervention")
private AppUser appUser;
@ManyToOne
@JoinColumn(name ="Id_AppDevlopper")
@JsonBackReference(value="appuser-intervention-devlopper")
private AppUser app ;
}
我在前端使用angular5,当我想保存新的干预措施时一切正常,这就是在phpmyadmin中保存日期的方式:
2018-06-22 13:10:2
当我尝试对angular5进行干预时,日期看起来像:
1529669422000
这是spring中的控制器:
RequestMapping(value="clientsintervention",method= RequestMethod.GET)
public Page<Intervention> getClientsIntervention(
@RequestParam(name="page",defaultValue = "0") int page,
@RequestParam(name="size",defaultValue = "5") int size,
@RequestParam(name="id",defaultValue ="0") Long id
){
AppUser appUser = userRepo.getOne(id);
return interventionRepo.interventionsOfClient(appUser,new PageRequest(page,size));
}
*在Angular中client.service.ts:
getClientsIntervention(page:number , size:number , idClient:number){
if(this.authService.getToken()==null) {
this.authService.loadToken();
}
return this.http.get(this.host+
"/clientsintervention?size="+size+"&page="+page+"&id="+idClient,{headers:new HttpHeaders({'Authorization':this.authService.getToken()})});
}
intervention.component.ts
interventionsclients(){
this.intervService.getClientsIntervention(this.page,this.size,this.id)
.subscribe((data:any)=>{
this.pageIntervention = data;
},err=>{
console.log('there is an error lady ! ');
})
}
intervention.component.html
<table class="table table-striped">
<thead>
<tr>
<th>Numéro</th>
<th>objet</th>
<th>date</th>
<th>Etat</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let c of pageIntervention?.content">
<td>{{c.id}}</td>
<td>{{c.objet}}</td>
<td>{{c.date}}</td> //The problem of showing date format is here !!
<td>
<button type="button" class="btn btn-warning" [hidden]="c.valid" >Non valide</button>
<button type="button" class="btn btn-primary" [hidden]="!c.valid" (click)="getDevlopperInformation(c.id)">Valide</button>
</td>
</tr>
</tbody>
</table>
用于保存新干预措施:
saveIntervention(){
this.date = new Date();
this.intervSevice.saveInterv( this.sujet, this.date , this.selectedTypeId , this.selectedProjectId , this.idClient)
.subscribe((data:any)=> {
swal("operation réussi !", "Great ! !", "success");
this.router.navigate([ '../list' ], { relativeTo: this.activatedRoute });
},err=>{
console.log('this is error');
})
我不明白为什么会这样,你知道吗?
答案 0 :(得分:1)
显示 dd-mm-yyyy 您需要使用
{{c.date | date : 'dd-MM-yyyy'}}