微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

如何在Angular Timepicker中设置默认值?

如何解决如何在Angular Timepicker中设置默认值?

我正在使用NgbTimepickerModule,这是我的模板:

<form [formGroup]="form">
  <div ngbDropdown>
  <input class="datepicker btn btn-link"  ngbDropdownToggle [value]="_value?(_value|date:'dd/MM/yy,HH:mm'):label">
      <div ngbDropdownMenu >
        <ngb-datepicker #dp [(ngModel)]="date" (dateSelect)="getDatetime()"[ngModelOptions]="{standalone:true}" ></ngb-datepicker>

        <ngb-timepicker [ngModel]="time" (ngModelChange)="time=$event;getDatetime()"[ngModelOptions]="{standalone:true}" [hourStep]="time?.hour" [minuteStep]="time?.minute"></ngb-timepicker>
      </div>
      </div>
  <button class="btn btn-primary">submit</button>
  </form>

我希望时间选择器在HH和MM输入中具有一些认值,并且不能为空

Timepicker blank

这是指向我的Stackblitz⚡

链接

是否还可以在我的日期时间选择器上添加“必需的验证”?

解决方法

我分叉了您的stackblitz示例,并调整了代码以实现您的要求。

这是我调整的代码库。

// initialized time object from time: any to
time: { hour: number,minute: number};

在您未设置时间的条件下添加默认时间

if (!this.time) {
    value =  new Date().getDate()+'/'+new Date().getMonth()+'/'+new Date().getFullYear()+' '+ new Date().getHours() +':'+ new Date().getMinutes();
  
  // note this part  
  this.time = {
      hour: new Date().getHours(),minute: new Date().getMinutes()
    };
  }

检出有效的DEMO

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。