在ngx-bootstrap datepicker上使用moment.js语言环境

时间:2018-01-19 10:21:39

标签: datepicker momentjs ngx-bootstrap

ngx-bootstrap有一个针对datepicker语言环境的自定义实现。 由于我的项目已经在使用moment.js语言环境,我想知道是否可以将moment.js语言环境与ngx-bootstrap datepicker一起使用?

1 个答案:

答案 0 :(得分:0)

是的,您可以使用以下两种方式:

<div class="row">
          <div class="col-xs-12">
            <label>Date</label>
            <input [(ngModel)]="distributionDate"
                   required tabindex="2"
                   class="form-control"
                   placeholder="please select a date"
                   bsDatepicker
                   [bsConfig]="{ dateInputFormat: 'MMMM D, YYYY', containerClass: 'theme-red' }"
                   (onHidden)="dateIsValid('distributionDate')"/>
          </div>
        </div>

[bsConfig] =使用时刻定义的格式。 (onHidden)=当您离开现场时执行的事件

您可以在某些服务中定义消费或仅在您的组件中定义。

dateIsValid(fieldName) {
if (!isNullOrUndefined(this[fieldName])) {
  if (moment(this.formatDate(this[fieldName]), 'MMMM D, YYYY', true).isValid()) {
    this[fieldName] = this.formatDate(this[fieldName]);
    this.errors[fieldName] = false;
    return true;
  } else {
    this.errors[fieldName] = true;
    return false;
  }
}

}