如何比较angular5中的两个日期?
How to make comparison between two dates in angular5?
如果第二个日期输入大于第一个日期输入,我尝试在 angular5 中不验证表单,然后显示一条错误消息,以便用户可以更改日期。
这是 .html 文件:
<div class="modal-body">
<form [formGroup]="form" (ngSubmit)="addProjecToClients()">
<div class="form-group row">
<label class="col-sm-5 col-form-label">Choisir un client : </label>
<div class="col-sm-6">
<ng-select *ngIf="_listClients"
[items]="_listClients"
bindLabel ="nom"
bindValue ="id"
[(ngModel)]="selectedPersonId"
formControlName="selectedPersonId"
>
</ng-select>
</div>
</div>
<label class="col-sm-5 col-form-label">Information liées au contrat : </label>
<div class="form-group row">
<label class="col-sm-5 col-form-label" >Date one : </label>
<div class="col-sm-6">
<input type="date" class="form-control form-control-sm"
placeholder=".form-control-sm" [(ngModel)]="dateOne"
formControlName="dateOne">
</div>
</div>
<div class="form-group row">
<label class="col-sm-5 col-form-label" for="input-small">Date two : </label>
<div class="col-sm-6">
<input type="date" id="input-small" name="input-small" class="form-control form-control-sm"
placeholder=".form-control-sm" [(ngModel)]="dateTwo"
formControlName="dateTwo">
<span style="color:red" *ngIf="validation()">DateTwo must be gt than dateone</span>
</div>
</div>
</div>
<button type="submit" class="btn btn-primary" [disabled]="!form.valid" >Save changes</button>
</form>
这是 .ts 文件:
export class ProjectsComponent implements OnInit {
dateOne:new Date() ;
dateTwo:new Date();
ngOnInit() {
this.doSearch();
this.dateOne= null;
this.dateTwo= null;
this.form = this.formBuilder.group({
dateOne: ['', Validators.required],
dateTwo: ['', Validators.required],
selectedPersonId: ['', Validators.required]
});
}
validation(){
if(this.dateOne && this.dateTwo){
if(this.dateOne.getTime() < this.dateTwo.getTime()){
return false;
}
else
return true;
}
}
}
有人建议我使用自定义验证器,但我找不到完整的简单示例。
任何帮助:)?
尝试使用此代码 getTime()
以毫秒为单位进行比较。
if(dateOne.getTime() > dateTwo.getTime())
如果第二个日期输入大于第一个日期输入,我尝试在 angular5 中不验证表单,然后显示一条错误消息,以便用户可以更改日期。
这是 .html 文件:
<div class="modal-body">
<form [formGroup]="form" (ngSubmit)="addProjecToClients()">
<div class="form-group row">
<label class="col-sm-5 col-form-label">Choisir un client : </label>
<div class="col-sm-6">
<ng-select *ngIf="_listClients"
[items]="_listClients"
bindLabel ="nom"
bindValue ="id"
[(ngModel)]="selectedPersonId"
formControlName="selectedPersonId"
>
</ng-select>
</div>
</div>
<label class="col-sm-5 col-form-label">Information liées au contrat : </label>
<div class="form-group row">
<label class="col-sm-5 col-form-label" >Date one : </label>
<div class="col-sm-6">
<input type="date" class="form-control form-control-sm"
placeholder=".form-control-sm" [(ngModel)]="dateOne"
formControlName="dateOne">
</div>
</div>
<div class="form-group row">
<label class="col-sm-5 col-form-label" for="input-small">Date two : </label>
<div class="col-sm-6">
<input type="date" id="input-small" name="input-small" class="form-control form-control-sm"
placeholder=".form-control-sm" [(ngModel)]="dateTwo"
formControlName="dateTwo">
<span style="color:red" *ngIf="validation()">DateTwo must be gt than dateone</span>
</div>
</div>
</div>
<button type="submit" class="btn btn-primary" [disabled]="!form.valid" >Save changes</button>
</form>
这是 .ts 文件:
export class ProjectsComponent implements OnInit {
dateOne:new Date() ;
dateTwo:new Date();
ngOnInit() {
this.doSearch();
this.dateOne= null;
this.dateTwo= null;
this.form = this.formBuilder.group({
dateOne: ['', Validators.required],
dateTwo: ['', Validators.required],
selectedPersonId: ['', Validators.required]
});
}
validation(){
if(this.dateOne && this.dateTwo){
if(this.dateOne.getTime() < this.dateTwo.getTime()){
return false;
}
else
return true;
}
}
}
有人建议我使用自定义验证器,但我找不到完整的简单示例。
任何帮助:)?
尝试使用此代码 getTime()
以毫秒为单位进行比较。
if(dateOne.getTime() > dateTwo.getTime())