Требуется угловой пользовательский компонент - PullRequest
0 голосов
/ 18 мая 2018

есть ли способ использовать атрибут required в моем пользовательском компоненте?Мой компонент выглядит следующим образом:

import { Component, Input, forwardRef } from '@angular/core';
import { Platform } from 'ionic-angular';
import { NG_VALUE_ACCESSOR, ControlValueAccessor } from '@angular/forms';

export const CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR: any = {
  provide: NG_VALUE_ACCESSOR,
  useExisting: forwardRef(() => DatePickerComponent),
  multi: true
};

@Component({
  selector: 'date-picker',
  templateUrl: 'date-picker.html',
  providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR]
})
export class DatePickerComponent implements ControlValueAccessor {
  @Input("label") label: string;
  @Input("pickerFormat") pickerFormat: string;
  @Input("displayFormat") displayFormat: string;
  @Input("max") max: string;
  @Input("min") min: string;
  @Input("cancelText") cancel: string;
  @Input("doneText") done: string;
  @Input("valid") valid: boolean;
  @Input("disabled") disabled: boolean;

  private _mobile: boolean = false;
  private _date: string;

  constructor(private plt: Platform) {
    if (plt.is("mobile"))
      this._mobile = true;
  }

  get date(): string {
    return this._date;
  }

  set date(value: string) {
    this._date = value;
    this.onChange(this._date);
  }

  public onChange(value: any): void { }

  public onTouched(): void { }

  public writeValue(obj: any): void {
    if (this.date !== obj) {
      this.date = obj;
    }
  }

  public registerOnChange(fn: any): void {
    this.onChange = fn;
  }

  public registerOnTouched(fn: any): void {
    this.onTouched = fn;
  }
}

Мне нужна моя форма, где я использую этот компонент, чтобы отключить кнопку отправки, если _date (или date) имеет значение NULL или недействительна дата (из-замин Макс).Могу ли я реализовать что-то подобное для моего компонента?

Спасибо за вашу помощь!

1 Ответ

0 голосов
/ 18 мая 2018

Сделайте так, чтобы он реализовал интерфейс Validator:

export class DatePickerComponent implements ControlValueAccessor, Validator {...}

, для этого требуется только одна функция, validate:

public validate(c: FormControl) {
  // Business logic. If no error, return null, if not : 
  return { required: true };
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...