Question

我在我的应用程序中使用mydatepicker，在更改事件中获取指令值但如何将结果值返回到日期选择器

import { Directive, ElementRef, Renderer, HostListener, EventEmitter, Output } from '@angular/core';
import { IMyDpOptions } from 'mydatepicker';

    @Directive({
        selector: '[DateNumberFormat]'
    })
    export class DateNumberFormat {
        @Output() ngModelChange = new EventEmitter();
        private el: any;

        constructor(
            public elementRef: ElementRef) {
            this.elementRef.nativeElement.maxLength = 8;
            this.el = this.elementRef.nativeElement;
        }

        @HostListener("change", ["$event.target.value"])


        onblur(value) {

             this.el.value = value;
            var dateObj = new Date();

            var month = dateObj.getUTCMonth() + 1; //months from 1-12
            var day = dateObj.getUTCDate();
            var year = dateObj.getUTCFullYear();

            var newdate = year + "/" + month + "/" + value;

            this.elementRef.nativeElement.value = newdate;

            //i want to return this new date to datepicker
            alert(newdate);

            return this.ngModelChange.emit(newdate);

        }

HTML

 <my-date-picker DateNumberFormat="true" name="mydate" id="mydate"  [options]="myDatePickerOptions" class="col-sm-8" maxlength="8"
                                        [(ngModel)]="model" required></my-date-picker>

元素参考值中的值设置但不绑定到datepicker

mydatepicker参考 https://github.com/kekeh/mydatepicker

Answer 1

我也面临同样的问题，您的html模板代码很好。有时，如果您的日期格式与mydatepicker不兼容，则日期将不会绑定到html。该解决方案将为您服务。

import { IMyDpOptions } from 'mydatepicker';

export class AppComponent implements OnInit {

  public myDatePickerOptions: IMyDpOptions = {
    // other options...
    dateFormat: 'yyyy-mm-dd',
    disableWeekends : true,
};
private model: Object = {};   // this is your date model in html
constructor(){}

  ngOnInit(){
  //this.date = new Date();
  // here you also can bind date from database side also.
  this.model = {jsdate: new Date('2018-08-21')}
  }

}

如何从angular 4指令返回mydatepicker的值

1 个答案: