Method _init

src/material/datepicker/multi-year-view.ts:179–202

Initializes this multi-year view.

()

  /** Initializes this multi-year view. */
  _init() {
    this._todayYear.set(this._dateAdapter.getYear(this._dateAdapter.today()));

    // We want a range years such that we maximize the number of
    // enabled dates visible at once. This prevents issues where the minimum year
    // is the last item of a page OR the maximum year is the first item of a page.

    // The offset from the active year to the "slot" for the starting year is the
    // *actual* first rendered year in the multi-year view.
    const activeYear = this._dateAdapter.getYear(this._activeDate);
    const minYearOfPage =
      activeYear - getActiveOffset(this._dateAdapter, this.activeDate, this.minDate, this.maxDate);

    const years: MatCalendarCell[][] = [];
    for (let i = 0, row: number[] = []; i < yearsPerPage; i++) {
      row.push(minYearOfPage + i);
      if (row.length == yearsPerRow) {
        years.push(row.map(year => this._createCellForYear(year)));
        row = [];
      }
    }
    this._years.set(years);
    this._changeDetectorRef.markForCheck();
  }

  /** Handles when a new year is selected. */
  _yearSelected(event: MatCalendarUserEvent<number>) {