diff --git a/src/components/datetime/datetime.ts b/src/components/datetime/datetime.ts index fdee679cf8..520fde3643 100644 --- a/src/components/datetime/datetime.ts +++ b/src/components/datetime/datetime.ts @@ -8,7 +8,7 @@ import { PickerColumn } from '../picker/picker-options'; import { Form } from '../../util/form'; import { Ion } from '../ion'; import { Item } from '../item/item'; -import { deepCopy, isBlank, isPresent, isTrueProperty, isArray, isString, assert } from '../../util/util'; +import { deepCopy, isBlank, isPresent, isTrueProperty, isArray, isString, assert, clamp } from '../../util/util'; import { dateValueRange, renderDateTime, renderTextFormat, convertFormatToKey, getValueFromFormat, parseTemplate, parseDate, updateDate, DateTimeData, convertDataToISO, daysInMonth, dateSortValue, dateDataSortValue, LocaleData } from '../../util/datetime-util'; export const DATETIME_VALUE_ACCESSOR: any = { @@ -514,14 +514,12 @@ export class DateTime extends Ion implements AfterContentInit, ControlValueAcces picker.refresh(); }); - picker.present(pickerOptions); - this._isOpen = true; picker.onDidDismiss(() => { this._isOpen = false; }); - picker.refresh(); + picker.present(pickerOptions); } /** @@ -565,7 +563,7 @@ export class DateTime extends Ion implements AfterContentInit, ControlValueAcces values = dateValueRange(format, this._min, this._max); } - let column: PickerColumn = { + const column: PickerColumn = { name: key, selectedIndex: 0, options: values.map(val => { @@ -578,8 +576,8 @@ export class DateTime extends Ion implements AfterContentInit, ControlValueAcces // cool, we've loaded up the columns with options // preselect the option for this column - var optValue = getValueFromFormat(this._value, format); - var selectedIndex = column.options.findIndex(opt => opt.value === optValue); + const optValue = getValueFromFormat(this._value, format); + const selectedIndex = column.options.findIndex(opt => opt.value === optValue); if (selectedIndex >= 0) { // set the select index for this column's options column.selectedIndex = selectedIndex; @@ -589,10 +587,10 @@ export class DateTime extends Ion implements AfterContentInit, ControlValueAcces picker.addColumn(column); }); - const min = this._min; - const max = this._max; // Normalize min/max + const min = this._min; + const max = this._max; const columns = this._picker.getColumns(); ['month', 'day', 'hour', 'minute'] .filter(name => !columns.find(column => column.name === name)) @@ -620,6 +618,8 @@ export class DateTime extends Ion implements AfterContentInit, ControlValueAcces const lb = lowerBounds.slice(); const ub = upperBounds.slice(); const options = column.options; + let indexMin = options.length - 1; + let indexMax = 0; for (var i = 0; i < options.length; i++) { var opt = options[i]; @@ -627,15 +627,19 @@ export class DateTime extends Ion implements AfterContentInit, ControlValueAcces lb[index] = opt.value; ub[index] = opt.value; - opt.disabled = ( + var disabled = opt.disabled = ( value < lowerBounds[index] || value > upperBounds[index] || dateSortValue(ub[0], ub[1], ub[2], ub[3], ub[4]) < min || dateSortValue(lb[0], lb[1], lb[2], lb[3], lb[4]) > max ); + if (!disabled) { + indexMin = Math.min(indexMin, i); + indexMax = Math.max(indexMax, i); + } } - - opt = column.options[column.selectedIndex]; + let selectedIndex = column.selectedIndex = clamp(indexMin, column.selectedIndex, indexMax); + opt = column.options[selectedIndex]; if (opt) { return opt.value; } diff --git a/src/components/datetime/test/issues/pages/root-page/root-page.html b/src/components/datetime/test/issues/pages/root-page/root-page.html index 14ac80ca9a..21a903abfe 100644 --- a/src/components/datetime/test/issues/pages/root-page/root-page.html +++ b/src/components/datetime/test/issues/pages/root-page/root-page.html @@ -104,5 +104,15 @@ > + + Current year Date + + + + + Last year Date + + + diff --git a/src/components/picker/picker-column.ts b/src/components/picker/picker-column.ts index 96f4718f65..940abdd314 100644 --- a/src/components/picker/picker-column.ts +++ b/src/components/picker/picker-column.ts @@ -78,9 +78,6 @@ export class PickerColumnCmp { // get the height of one option this.optHeight = (colEle.firstElementChild ? colEle.firstElementChild.clientHeight : 0); - // set the scroll position for the selected option - this.setSelected(this.col.selectedIndex, 0); - // Listening for pointer events this.events.pointerEvents({ element: this.elementRef.nativeElement, @@ -384,6 +381,7 @@ export class PickerColumnCmp { } } } + this.col.prevSelected = selectedIndex; if (saveY) { this.y = y; @@ -409,19 +407,20 @@ export class PickerColumnCmp { refresh() { let min = this.col.options.length - 1; let max = 0; - - for (var i = 0; i < this.col.options.length; i++) { - if (!this.col.options[i].disabled) { + const options = this.col.options; + for (var i = 0; i < options.length; i++) { + if (!options[i].disabled) { min = Math.min(min, i); max = Math.max(max, i); } } - var selectedIndex = clamp(min, this.col.selectedIndex, max); - - if (selectedIndex !== this.col.selectedIndex) { + const selectedIndex = clamp(min, this.col.selectedIndex, max); + if (this.col.prevSelected !== selectedIndex) { var y = (selectedIndex * this.optHeight) * -1; - this.update(y, 150, true, true); + this._plt.cancelRaf(this.rafId); + this.velocity = 0; + this.update(y, 150, true, false); } } diff --git a/src/components/picker/picker-component.ts b/src/components/picker/picker-component.ts index 4323427f86..9e6c0c2bee 100644 --- a/src/components/picker/picker-component.ts +++ b/src/components/picker/picker-component.ts @@ -40,6 +40,7 @@ import { PickerColumnCmp } from './picker-column'; encapsulation: ViewEncapsulation.None, }) export class PickerCmp { + @ViewChildren(PickerColumnCmp) _cols: QueryList; d: PickerOptions; enabled: boolean; @@ -116,6 +117,10 @@ export class PickerCmp { }); } + ionViewDidLoad() { + this.refresh(); + } + ionViewWillEnter() { this._gestureBlocker.block(); } @@ -125,9 +130,7 @@ export class PickerCmp { } refresh() { - this._cols.forEach(column => { - column.refresh(); - }); + this._cols.forEach(column => column.refresh()); } _colChange(selectedOption: PickerColumnOption) { diff --git a/src/components/picker/picker-options.ts b/src/components/picker/picker-options.ts index 5bf985bb27..8bedbfaad7 100644 --- a/src/components/picker/picker-options.ts +++ b/src/components/picker/picker-options.ts @@ -10,6 +10,7 @@ export interface PickerColumn { name?: string; align?: string; selectedIndex?: number; + prevSelected?: number; prefix?: string; suffix?: string; options?: PickerColumnOption[]; diff --git a/src/components/picker/picker.ts b/src/components/picker/picker.ts index 2d6883d511..69a802602c 100644 --- a/src/components/picker/picker.ts +++ b/src/components/picker/picker.ts @@ -2,7 +2,7 @@ import { EventEmitter, Output } from '@angular/core'; import { App } from '../app/app'; import { Config } from '../../config/config'; -import { isPresent } from '../../util/util'; +import { isPresent, assert } from '../../util/util'; import { NavOptions } from '../../navigation/nav-util'; import { PickerCmp } from './picker-component'; import { PickerOptions, PickerColumn } from './picker-options'; @@ -67,6 +67,9 @@ export class Picker extends ViewController { } refresh() { + assert(this._cmp, 'componentRef must be valid'); + assert(this._cmp.instance.refresh, 'instance must implement refresh()'); + this._cmp && this._cmp.instance.refresh && this._cmp.instance.refresh(); } diff --git a/src/navigation/nav-controller-base.ts b/src/navigation/nav-controller-base.ts index f3e08261b6..41fae526fa 100644 --- a/src/navigation/nav-controller-base.ts +++ b/src/navigation/nav-controller-base.ts @@ -517,6 +517,7 @@ export class NavControllerBase extends Ion implements NavController { _viewAttachToDOM(view: ViewController, componentRef: ComponentRef, viewport: ViewContainerRef) { assert(view._state === STATE_INITIALIZED, 'view state must be INITIALIZED'); + assert(componentRef, 'componentRef can not be null'); // fire willLoad before change detection runs this._willLoad(view); diff --git a/src/navigation/view-controller.ts b/src/navigation/view-controller.ts index dc61da36a9..b5591f5557 100644 --- a/src/navigation/view-controller.ts +++ b/src/navigation/view-controller.ts @@ -116,6 +116,8 @@ export class ViewController { * @hidden */ init(componentRef: ComponentRef) { + assert(componentRef, 'componentRef can not be null'); + this._cmp = componentRef; this.instance = this.instance || componentRef.instance; this._detached = false;