Getting error on ng serve: Type 'null' is not assignable to type 'string

I am working on an Angular Project. I am trying to use ngx-daterangepicker-material. I have installed the below packages:

npm install ngx-daterangepicker-material --save

npm install dayjs --save

I have added sample code shown as per ngx-daterangepicker-material.

My component.ts and component.html has below code:

ranges: any = {
    'Today': [dayjs(), dayjs()],
    'Yesterday': [dayjs().subtract(1, 'days'), dayjs().subtract(1, 'days')],
    'Last 7 Days': [dayjs().subtract(6, 'days'), dayjs()],
    'Last 30 Days': [dayjs().subtract(29, 'days'), dayjs()],
    'This Month': [dayjs().startOf('month'), dayjs().endOf('month')],
    'Last Month': [dayjs().subtract(1, 'month').startOf('month'), dayjs().subtract(1, 'month').endOf('month')]
  }

  model: any;

<input type="text" ngxDaterangepickerMd startKey="start" endKey="end" [ranges]="ranges" [(ngModel)]="model">

As soon as I run ng serve, I got below error:


Error: node_modules/ngx-daterangepicker-material/daterangepicker.component.d.ts:173:9 - error TS2380: The return type of a 'get' accessor must be assignable to its 'set' accessor type
  Type 'null' is not assignable to type 'string | Dayjs'.

173     get minDate(): dayjs.Dayjs | null;
            ~~~~~~~


Error: node_modules/ngx-daterangepicker-material/daterangepicker.component.d.ts:179:9 - error TS2380: The return type of a 'get' accessor must be assignable to its 'set' accessor type

179     get maxDate(): dayjs.Dayjs | null;
            ~~~~~~~

As per above error, it does not seem from my code. It is pointing to code under node_modules folder.

Below are the versions from package.json

"dayjs": "^1.11.5",

"ngx-daterangepicker-material": "^6.0.2",

Could someone help in resolving this error?

CodePudding user response：

As per your comment of No provider for LocaleService!.

You should configure the necessary providers like below.

    import { LocaleService } from './locale.service';
.
.
.
.


    { provide: LocaleService, useClass: LocaleService, deps: [LOCALE_CONFIG] },

For more info, please click Here

CodePudding user response：

As suggested by @NarenMurali under comments, adding "skipLibCheck": true under compilerOptions of tsconfig.json file resolved this issue.

PS: I had faced another issue of getting NullInjectorError. It was because of my module hierarchy. After adding NgxDaterangepickerMd.forRoot() under AppModule, that error been resolved.