简体   繁体   English

使用 ngmodel - Angular 将值设置为角度材​​料日期选择器

[英]Set value to angular material datepicker using ngmodel - Angular

I'm trying to edit selected value to a custom control value accessor angular material date component but I'm it's return an empty input field.我正在尝试将选定值编辑为自定义控件值访问器角度材料日期组件,但它返回一个空的输入字段。

App.Component.Html应用组件.html

<date-input  ngModel="dateValue"
                name="dateName">
              </date-input>

DateInputComponent.html日期输入组件.html

  <mat-form-field>
    <input [(ngModel)]="value" matInput [matDatepicker]="picker1" >
    <mat-datepicker-toggle matSuffix [for]="picker1"></mat-datepicker-toggle>
    <mat-datepicker #picker1></mat-datepicker>
  </mat-form-field>
</div>

DateInputComponent.ts日期输入组件.ts

get value(): any {
    return this.innerValue;
  }

  // set accessor including call the onchange callback
  set value(v: any) {
    if (v !== this.innerValue) {
      this.innerValue = v;
      this.onChangeCallback(v);
    }
  }

  // The internal data model
  private innerValue: any = '';

  // Placeholders for the callbacks which are later provided
  // by the Control Value Accessor
  private onTouchedCallback: () => void = noop;
  private onChangeCallback: (_: any) => void = noop;

  ngOnInit() {
    // this.formControlItem = this.formControlItem[this.LabelInput.fieldName];
    this.showInput = true;
  }

  // Set touched on blur
  onBlur() {
    this.onTouchedCallback();
  }

  // From ControlValueAccessor interface
  writeValue(value: any) {
    if (value !== this.innerValue) {
      this.innerValue = value;
    }
  }

This how the value look like这是价值的样子

Tue Feb 11 2020 00:00:00 GMT+0200 (Eastern European Standard Time)

As I said above, nothing show up in the date field if I want to edit the value正如我上面所说,如果我想编辑值,日期字段中不会显示任何内容

ngModel 绑定语法错误。

<date-input [(ngModel)]="dateValue" name="dateName"></date-input>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM