How to show only one month in ngx-daterangepicker-material date range picker?

Question

I want to show only one month in date range picker like mentioned below.

Current Date Range Picker:

And I want something like this:

Answer 1

I didn't see the right option from the docs, so I just removed the right side of the calendar.

import {
  AfterViewInit,
  Component,
  ViewChild,
} from '@angular/core';
import * as moment from 'moment';
import { DaterangepickerDirective } from 'ngx-daterangepicker-material';
@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
})
export class AppComponent implements AfterViewInit {
  @ViewChild(DaterangepickerDirective, { static: true })
  picker: DaterangepickerDirective;
  selected: { startDate: moment.Moment; endDate: moment.Moment };
  name = 'Angular';
  open() {
    this.picker.open();
  }

  ngAfterViewInit() {
    const rightCalendar = document.getElementsByClassName('calendar right');
    if (rightCalendar.item(0)) {
      rightCalendar.item(0).remove();
    }
  }
}

Html

<input type="text" matInput
    ngxDaterangepickerMd
    [locale]="{applyLabel: 'ok', format: 'DD-MM-YYYY'}"
    startKey="start"
    endKey="end"
    [alwaysShowCalendars]="false"
    [(ngModel)]="selected"
    name="daterange"/>

Working example: https://stackblitz.com/edit/ngx-daterangepicker-material-for-angular8-zucirm?file=src%2Fapp%2Fapp.component.html