From fbd6e8d720922e35fe4e6769ba36933c468e9ec6 Mon Sep 17 00:00:00 2001 From: Max Okorokov Date: Fri, 15 Nov 2019 16:33:34 +0100 Subject: [PATCH] refactor(datepicker): inherit 'NgbInputDatepickerConfig' from 'NgbDatepickerConfig' --- .../demos/config/datepicker-config.ts | 18 ++++++++---------- src/datepicker/datepicker-input-config.ts | 3 ++- src/datepicker/datepicker-input.ts | 6 +++++- 3 files changed, 15 insertions(+), 12 deletions(-) diff --git a/demo/src/app/components/datepicker/demos/config/datepicker-config.ts b/demo/src/app/components/datepicker/demos/config/datepicker-config.ts index d3e71225ee..44cdf850e4 100644 --- a/demo/src/app/components/datepicker/demos/config/datepicker-config.ts +++ b/demo/src/app/components/datepicker/demos/config/datepicker-config.ts @@ -1,6 +1,5 @@ import {Component} from '@angular/core'; import { - NgbDatepickerConfig, NgbCalendar, NgbDate, NgbDateStruct, @@ -10,28 +9,27 @@ import { @Component({ selector: 'ngbd-datepicker-config', templateUrl: './datepicker-config.html', - providers: [NgbDatepickerConfig] // add NgbDatepickerConfig to the component providers + providers: [NgbInputDatepickerConfig] // add config to the component providers }) export class NgbdDatepickerConfig { model: NgbDateStruct; - constructor( - datepickerConfig: NgbDatepickerConfig, inputDatepickerConfig: NgbInputDatepickerConfig, calendar: NgbCalendar) { + constructor(config: NgbInputDatepickerConfig, calendar: NgbCalendar) { // customize default values of datepickers used by this component tree - datepickerConfig.minDate = {year: 1900, month: 1, day: 1}; - datepickerConfig.maxDate = {year: 2099, month: 12, day: 31}; + config.minDate = {year: 1900, month: 1, day: 1}; + config.maxDate = {year: 2099, month: 12, day: 31}; // days that don't belong to current month are not visible - datepickerConfig.outsideDays = 'hidden'; + config.outsideDays = 'hidden'; // weekends are disabled - datepickerConfig.markDisabled = (date: NgbDate) => calendar.getWeekday(date) >= 6; + config.markDisabled = (date: NgbDate) => calendar.getWeekday(date) >= 6; // setting datepicker popup to close only on click outside - inputDatepickerConfig.autoClose = 'outside'; + config.autoClose = 'outside'; // setting datepicker popup to open above the input - inputDatepickerConfig.placement = ['top-left', 'top-right']; + config.placement = ['top-left', 'top-right']; } } diff --git a/src/datepicker/datepicker-input-config.ts b/src/datepicker/datepicker-input-config.ts index 4366b7389e..3ed85c6b31 100644 --- a/src/datepicker/datepicker-input-config.ts +++ b/src/datepicker/datepicker-input-config.ts @@ -1,5 +1,6 @@ import {Injectable} from '@angular/core'; +import {NgbDatepickerConfig} from './datepicker-config'; import {PlacementArray} from '../util/positioning'; /** @@ -9,7 +10,7 @@ import {PlacementArray} from '../util/positioning'; * order to provide default values for all the datepicker inputs used in the application. */ @Injectable({providedIn: 'root'}) -export class NgbInputDatepickerConfig { +export class NgbInputDatepickerConfig extends NgbDatepickerConfig { autoClose: boolean | 'inside' | 'outside' = true; container: null | 'body'; positionTarget: string | HTMLElement; diff --git a/src/datepicker/datepicker-input.ts b/src/datepicker/datepicker-input.ts index be9366e618..d558b017cc 100644 --- a/src/datepicker/datepicker-input.ts +++ b/src/datepicker/datepicker-input.ts @@ -33,6 +33,7 @@ import {NgbDate} from './ngb-date'; import {NgbDateParserFormatter} from './ngb-date-parser-formatter'; import {NgbDateStruct} from './ngb-date-struct'; import {NgbInputDatepickerConfig} from './datepicker-input-config'; +import {NgbDatepickerConfig} from './datepicker-config'; const NGB_DATEPICKER_VALUE_ACCESSOR = { provide: NG_VALUE_ACCESSOR, @@ -61,7 +62,10 @@ const NGB_DATEPICKER_VALIDATOR = { '(blur)': 'onBlur()', '[disabled]': 'disabled' }, - providers: [NGB_DATEPICKER_VALUE_ACCESSOR, NGB_DATEPICKER_VALIDATOR, NgbDatepickerService] + providers: [ + NGB_DATEPICKER_VALUE_ACCESSOR, NGB_DATEPICKER_VALIDATOR, NgbDatepickerService, + {provide: NgbDatepickerConfig, useExisting: NgbInputDatepickerConfig} + ], }) export class NgbInputDatepicker implements OnChanges, OnDestroy, ControlValueAccessor, Validator {