【问题标题】:ERROR TypeError: this.dateDebut.getTime is not a function : Angular5错误类型错误:this.dateDebut.getTime 不是函数:Angular5
【发布时间】:2018-11-09 10:30:35
【问题描述】:

我正在使用 angular5 ,我有两个类型为 date 的输入。 如果第一个日期输入大于第二个日期输入,我会尝试不验证表单。

所以有两种情况:

  1. 当 dateOne>dateTwo 向用户显示错误消息时。
  2. 当日期一 用户可以提交表单。

这是我尝试做的代码:

这是 .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 greater 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;
    }

      }

    }

但是我收到了这个错误:

ERROR TypeError: this.dateOne.getTime is not a function
at ProjectsComponent.validation (projects.component.ts:65)
at Object.eval [as updateDirectives] (ProjectsComponent.html:89)
at Object.debugUpdateDirectives [as updateDirectives] (core.js:14638)
at checkAndUpdateView 

【问题讨论】:

  • 嗯,在 ngOnInit 中,您将日期设置为空,不是吗?
  • 是的,因为我不希望在我选择 dateOne 和 dateTwo 之前出现错误消息,这就是我将日期设置为 null 的原因。
  • 你能把整个问题提取到我们可以重现的地方吗?
  • new Date(this.dateOne).getTime() 解决了这个问题,谢谢:)

标签: angular angular5 frontend


【解决方案1】:

this.dateOne 和 this.dateTwo 的“typeof”为字符串,在使用 getTime() 函数之前需要将其转换为 Date() 类型。

new Date(this.dateOne).getTime()

【讨论】:

    猜你喜欢
    • 2018-04-28
    • 2019-02-14
    • 2021-10-02
    • 2021-10-30
    • 2018-11-22
    • 2017-10-12
    • 2020-06-05
    • 2023-03-15
    • 2018-10-21
    相关资源
    最近更新 更多