how to conditionally add mydatepicker disablescince prop only for a particular field in angular

Question

present mydatepicker options are as below: in ts file

myDatePickerOptions: IMyDpOptions = {
    // other options...
    dateFormat: 'dd-mmm-yyyy',
    editableDateField: false,
    openSelectorOnInputClick: true,
};

html file:

<my-date-picker
    #subjectdob="ngModel"
    editableDateField="false"
    maxlength="10"
    name="subjectdob"
    [(ngModel)]="serviceRequestFormDetails.srfSubjectDetails.dateOfBirth"
    [options]="myDatePickerOptions"
    required
></my-date-picker>

where as in html file i am having multiple date pickers and for only dateofibirth field i want to use disableSince prop got struck here.can any one help me to achieve this?

There are a couple of libraries named my-date-picket, which npm package are you using? — B45i, Oct 27 '20 at 16:48
using https://www.npmjs.com/package/mydatepicker sorry i forgot to mention it — Monika, Oct 27 '20 at 17:00

score 1 · Accepted Answer · answered Oct 27 '20 at 17:20

Create another IMyDpOptions object and extend the common properties using spread operator and add the extra disableSince property to the variable

  myDatePickerOptions: IMyDpOptions = {
    // other options...
    dateFormat: "dd-mmm-yyyy",
    editableDateField: false,
    openSelectorOnInputClick: true
  };

  myDOBDatePickerOptions: IMyDpOptions = {
    ...this.myDatePickerOptions,
    disableSince: { year: 2020, month: 10, day: 27 }
  };

use myDOBDatePickerOptions for only the dateofibirth field

<my-date-picker
  #subjectdob="ngModel"
  editableDateField="false"
  maxlength="10"
  name="subjectdob"
  [(ngModel)]="serviceRequestFormDetails.srfSubjectDetails.dateOfBirth
  [options]="myDOBDatePickerOptions"
  required
></my-date-picker>

thak you very much its working, but is there any other way rather than using options multiple times???? — Monika, Oct 28 '20 at 05:21
@Monika, Was not able to figure out another solution, Consider Upvoting / Accepting answer if my solution was helpful. — B45i, Oct 28 '20 at 07:00

how to conditionally add mydatepicker disablescince prop only for a particular field in angular

1 Answers1