javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-20 12:29:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(base-input): initialize on ngAfterContentInit

Browse Source
This commit is contained in:
Manuel Mtz-Almeida
2017-04-27 22:56:54 +02:00
parent 6677d80343
commit 239b559e6e
11 changed files with 44 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/checkbox/checkbox.ts
View File

@ -1,4 +1,4 @@
import { AfterViewInit, ChangeDetectorRef, Component, ElementRef, HostListener, Input, OnDestroy, Optional, Renderer, ViewEncapsulation } from '@angular/core';
import { ChangeDetectorRef, Component, ElementRef, HostListener, Input, OnDestroy, Optional, Renderer, ViewEncapsulation } from '@angular/core';
import { NG_VALUE_ACCESSOR } from '@angular/forms';
import { Config } from '../../config/config';
@ -66,7 +66,7 @@ import { Item } from '../item/item';
providers: [ { provide: NG_VALUE_ACCESSOR, useExisting: Checkbox, multi: true } ],
encapsulation: ViewEncapsulation.None,
})
export class Checkbox extends BaseInput<boolean> implements IonicTapInput, AfterViewInit, OnDestroy {
export class Checkbox extends BaseInput<boolean> implements IonicTapInput, OnDestroy {
/**
* @input {boolean} If true, the element is selected.

6
src/components/datetime/datetime.ts
View File

@ -1,4 +1,4 @@
import { AfterViewInit, Component, ElementRef, EventEmitter, HostListener, Input, OnDestroy, Optional, Output, Renderer, ViewEncapsulation } from '@angular/core';
import { AfterContentInit, Component, ElementRef, EventEmitter, HostListener, Input, OnDestroy, Optional, Output, Renderer, ViewEncapsulation } from '@angular/core';
import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
import { Config } from '../../config/config';
@ -267,7 +267,7 @@ import { dateValueRange, renderDateTime, renderTextFormat, convertDataToISO, con
providers: [ { provide: NG_VALUE_ACCESSOR, useExisting: DateTime, multi: true } ],
encapsulation: ViewEncapsulation.None,
})
export class DateTime extends BaseInput<DateTimeData> implements AfterViewInit, ControlValueAccessor, OnDestroy {
export class DateTime extends BaseInput<DateTimeData> implements AfterContentInit, ControlValueAccessor, OnDestroy {
_text: string = '';
_min: DateTimeData;
@ -425,7 +425,7 @@ export class DateTime extends BaseInput<DateTimeData> implements AfterViewInit,
/**
* @hidden
*/
ngAfterViewInit() {
ngAfterContentInit() {
// first see if locale names were provided in the inputs
// then check to see if they're in the config
// if neither were provided then it will use default English names

16
src/components/datetime/test/datetime.spec.ts
View File

@ -144,7 +144,7 @@ describe('DateTime', () => {
describe('writeValue', () => {
it('should updateText with default MMM D, YYYY when no displayFormat or pickerFormat', zoned(() => {
datetime.ngAfterViewInit();
datetime.ngAfterContentInit();
datetime.writeValue('1994-12-15T13:47:20.789Z');
expect(datetime._text).toEqual('Dec 15, 1994');
@ -152,7 +152,7 @@ describe('DateTime', () => {
it('should updateText with pickerFormat when no displayFormat', zoned(() => {
datetime.pickerFormat = 'YYYY';
datetime.ngAfterViewInit();
datetime.ngAfterContentInit();
datetime.writeValue('1994-12-15T13:47:20.789Z');
expect(datetime._text).toEqual('1994');
@ -160,7 +160,7 @@ describe('DateTime', () => {
it('should updateText with displayFormat when no pickerFormat', zoned(() => {
datetime.displayFormat = 'YYYY';
datetime.ngAfterViewInit();
datetime.ngAfterContentInit();
datetime.writeValue('1994-12-15T13:47:20.789Z');
expect(datetime._text).toEqual('1994');
@ -172,7 +172,7 @@ describe('DateTime', () => {
it('should generate with default MMM D, YYYY when no displayFormat or pickerFormat', zoned(() => {
datetime.monthShortNames = customLocale.monthShortNames;
datetime.ngAfterViewInit();
datetime.ngAfterContentInit();
datetime.setValue('1994-12-15T13:47:20.789Z');
datetime.generate();
@ -186,7 +186,7 @@ describe('DateTime', () => {
it('should generate with only displayFormat', zoned(() => {
datetime.monthShortNames = customLocale.monthShortNames;
datetime.ngAfterViewInit();
datetime.ngAfterContentInit();
datetime.displayFormat = 'YYYY';
datetime.setValue('1994-12-15T13:47:20.789Z');
@ -199,7 +199,7 @@ describe('DateTime', () => {
it('should generate with only pickerFormat', zoned(() => {
datetime.monthShortNames = customLocale.monthShortNames;
datetime.ngAfterViewInit();
datetime.ngAfterContentInit();
datetime.pickerFormat = 'YYYY';
datetime.setValue('1994-12-15T13:47:20.789Z');
@ -212,7 +212,7 @@ describe('DateTime', () => {
it('should generate with custom locale short month names from input property', zoned(() => {
datetime.monthShortNames = customLocale.monthShortNames;
datetime.ngAfterViewInit();
datetime.ngAfterContentInit();
datetime.pickerFormat = 'MMM YYYY';
datetime.setValue('1994-12-15T13:47:20.789Z');
@ -227,7 +227,7 @@ describe('DateTime', () => {
it('should generate with custom locale full month names from input property', zoned(() => {
datetime.monthNames = customLocale.monthNames;
datetime.ngAfterViewInit();
datetime.ngAfterContentInit();
datetime.pickerFormat = 'MMMM YYYY';
datetime.setValue('1994-12-15T13:47:20.789Z');

6
src/components/range/range.ts
View File

@ -1,4 +1,4 @@
import { AfterViewInit, ChangeDetectorRef, Component, ElementRef, Input, OnDestroy, Optional, Renderer, ViewChild, ViewEncapsulation } from '@angular/core';
import { AfterContentInit, ChangeDetectorRef, Component, ElementRef, Input, OnDestroy, Optional, Renderer, ViewChild, ViewEncapsulation } from '@angular/core';
import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
import { clamp, isTrueProperty } from '../../util/util';
@ -104,7 +104,7 @@ import { UIEventManager } from '../../gestures/ui-event-manager';
providers: [ { provide: NG_VALUE_ACCESSOR, useExisting: Range, multi: true } ],
encapsulation: ViewEncapsulation.None,
})
export class Range extends BaseInput<any> implements AfterViewInit, ControlValueAccessor, OnDestroy {
export class Range extends BaseInput<any> implements AfterContentInit, ControlValueAccessor, OnDestroy {
_dual: boolean;
_pin: boolean;
@ -266,7 +266,7 @@ export class Range extends BaseInput<any> implements AfterViewInit, ControlValue
/**
* @hidden
*/
ngAfterViewInit() {
ngAfterContentInit() {
this._initialize();
// add touchstart/mousedown listeners

23
src/components/searchbar/searchbar.ts
View File

@ -172,15 +172,6 @@ export class Searchbar extends BaseInput<string> {
@ViewChild('cancelButton', {read: ElementRef}) _cancelButton: ElementRef;
/**
* @hidden
* After View Checked position the elements
*/
ngAfterViewInit() {
this._initialize();
this.positionElements();
}
/**
* @hidden
* On Initialization check for attributes
@ -196,11 +187,9 @@ export class Searchbar extends BaseInput<string> {
* @hidden
*/
_inputUpdated() {
if (this._searchbarInput) {
var ele = this._searchbarInput.nativeElement;
if (ele) {
ele.value = this.value;
}
const ele = this._searchbarInput.nativeElement;
if (ele) {
ele.value = this.value;
}
this.positionElements();
}
@ -229,9 +218,6 @@ export class Searchbar extends BaseInput<string> {
}
positionPlaceholder() {
if (!this._searchbarInput || !this._searchbarIcon) {
return;
}
const inputEle = this._searchbarInput.nativeElement;
const iconEle = this._searchbarIcon.nativeElement;
@ -265,9 +251,6 @@ export class Searchbar extends BaseInput<string> {
* Show the iOS Cancel button on focus, hide it offscreen otherwise
*/
positionCancelButton() {
if (!this._cancelButton || !this._cancelButton.nativeElement) {
return;
}
const showShowCancel = this._isFocus;
if (showShowCancel !== this._isCancelVisible) {
var cancelStyleEle = this._cancelButton.nativeElement;

6
src/components/searchbar/test/basic/pages/root-page/root-page.html
View File

@ -44,4 +44,10 @@
<p padding>
<button ion-button block (click)="changeValue()">Change Value</button>
</p>
<button ion-button (click)="activeTab = 'a'">Error Please</button>
<div *ngIf="activeTab == 'a'">
<ion-searchbar animated="true" [showCancelButton]="true"></ion-searchbar>
</div>
</ion-content>

1
src/components/searchbar/test/basic/pages/root-page/root-page.ts
View File

@ -13,6 +13,7 @@ export class RootPage {
isAutocorrect: string = 'on';
isAutocomplete: string = 'on';
isSpellcheck: boolean = true;
activeTab = '';
constructor(private changeDetectorRef: ChangeDetectorRef) {

21
src/components/segment/segment.ts
View File

@ -1,8 +1,9 @@
import { ContentChildren, Directive, ElementRef, Optional, QueryList, Renderer } from '@angular/core';
import { AfterContentInit, ContentChildren, Directive, ElementRef, Optional, QueryList, Renderer } from '@angular/core';
import { NgControl } from '@angular/forms';
import { Config } from '../../config/config';
import { BaseInput } from '../../util/base-input';
import { assert } from '../../util/util';
import { SegmentButton } from './segment-button';
/**
@ -67,7 +68,7 @@ import { SegmentButton } from './segment-button';
'[class.segment-disabled]': '_disabled'
}
})
export class Segment extends BaseInput<string> {
export class Segment extends BaseInput<string> implements AfterContentInit {
/**
* @hidden
@ -86,7 +87,7 @@ export class Segment extends BaseInput<string> {
/**
* @hidden
*/
ngAfterViewInit() {
ngAfterContentInit() {
this._initialize();
this._buttons.forEach(button => {
button.ionSelect.subscribe((selectedButton: any) => this.value = selectedButton.value);
@ -98,12 +99,14 @@ export class Segment extends BaseInput<string> {
* Write a new value to the element.
*/
_inputUpdated() {
if (this._buttons) {
var buttons = this._buttons.toArray();
var value = this.value;
for (var button of buttons) {
button.isActive = (button.value === value);
}
if (!this._buttons) {
assert(false, 'buttons are undefined');
return;
}
const buttons = this._buttons.toArray();
const value = this.value;
for (var button of buttons) {
button.isActive = (button.value === value);
}
}

4
src/components/select/select.ts
View File

@ -1,4 +1,4 @@
import { AfterViewInit, Component, ContentChildren, ElementRef, EventEmitter, Input, HostListener, OnDestroy, Optional, Output, Renderer, QueryList, ViewEncapsulation } from '@angular/core';
import { Component, ContentChildren, ElementRef, EventEmitter, Input, HostListener, OnDestroy, Optional, Output, Renderer, QueryList, ViewEncapsulation } from '@angular/core';
import { NG_VALUE_ACCESSOR } from '@angular/forms';
import { ActionSheet } from '../action-sheet/action-sheet';
@ -147,7 +147,7 @@ import { SelectPopover, SelectPopoverOption } from './select-popover-component';
providers: [ { provide: NG_VALUE_ACCESSOR, useExisting: Select, multi: true } ],
encapsulation: ViewEncapsulation.None,
})
export class Select extends BaseInput<any> implements AfterViewInit, OnDestroy {
export class Select extends BaseInput<any> implements OnDestroy {
_multi: boolean = false;
_options: QueryList<Option>;

6
src/util/base-input.ts
View File

@ -1,4 +1,4 @@
import { ElementRef, EventEmitter, Input, NgZone, Output, Renderer } from '@angular/core';
import { AfterContentInit, ElementRef, EventEmitter, Input, NgZone, Output, Renderer } from '@angular/core';
import { ControlValueAccessor } from '@angular/forms';
import { NgControl } from '@angular/forms';
@ -10,7 +10,7 @@ import { Form } from './form';
import { TimeoutDebouncer } from './debouncer';
export interface CommonInput<T> extends ControlValueAccessor {
export interface CommonInput<T> extends ControlValueAccessor, AfterContentInit {
id: string;
disabled: boolean;
@ -271,7 +271,7 @@ export class BaseInput<T> extends Ion implements CommonInput<T> {
/**
* @hidden
*/
ngAfterViewInit() {
ngAfterContentInit() {
this._initialize();
}

2
src/util/input-tester.ts
View File

@ -55,7 +55,7 @@ export function commonInputTest<T>(input: BaseInput<T>, config: TestConfig) {
const zone = new NgZone(true);
zone.run(() => {
testInput(input, config, false);
input.ngAfterViewInit();
input.ngAfterContentInit();
testInput(input, config, true);
input.ngOnDestroy();
assert(!input._init, 'input was not destroyed correctly');