fix(input): prevent exception when input components outside Content

This commit is contained in:
Josep Sayol
2016-12-14 21:27:19 +01:00
committed by Adam Bradley
parent 4f61ea5f9b
commit e80f4cf88d
5 changed files with 72 additions and 12 deletions

View File

@ -1,4 +1,4 @@
import { ElementRef, Renderer } from '@angular/core'; import { ElementRef, Renderer, Optional } from '@angular/core';
import { NgControl } from '@angular/forms'; import { NgControl } from '@angular/forms';
import { App } from '../app/app'; import { App } from '../app/app';
@ -52,7 +52,7 @@ export class InputBase extends Ion implements IonicFormInput {
protected _platform: Platform, protected _platform: Platform,
elementRef: ElementRef, elementRef: ElementRef,
renderer: Renderer, renderer: Renderer,
protected _content: Content, @Optional() protected _content: Content,
nav: NavController, nav: NavController,
ngControl: NgControl, ngControl: NgControl,
protected _dom: DomController protected _dom: DomController
@ -75,12 +75,15 @@ export class InputBase extends Ion implements IonicFormInput {
_form.register(this); _form.register(this);
this._scrollStart = _content.ionScrollStart.subscribe((ev: ScrollEvent) => { // only listen to content scroll events if there is content
this.scrollHideFocus(ev, true); if (_content) {
}); this._scrollStart = _content.ionScrollStart.subscribe((ev: ScrollEvent) => {
this._scrollEnd = _content.ionScrollEnd.subscribe((ev: ScrollEvent) => { this.scrollHideFocus(ev, true);
this.scrollHideFocus(ev, false); });
}); this._scrollEnd = _content.ionScrollEnd.subscribe((ev: ScrollEvent) => {
this.scrollHideFocus(ev, false);
});
}
} }
scrollHideFocus(ev: ScrollEvent, shouldHideFocus: boolean) { scrollHideFocus(ev: ScrollEvent, shouldHideFocus: boolean) {

View File

@ -240,8 +240,12 @@ export class TextInput extends InputBase {
*/ */
ngOnDestroy() { ngOnDestroy() {
this._form.deregister(this); this._form.deregister(this);
this._scrollStart.unsubscribe();
this._scrollEnd.unsubscribe(); // only stop listening to content scroll events if there is content
if (this._content) {
this._scrollStart.unsubscribe();
this._scrollEnd.unsubscribe();
}
} }
/** /**
@ -410,8 +414,12 @@ export class TextArea extends InputBase {
*/ */
ngOnDestroy() { ngOnDestroy() {
this._form.deregister(this); this._form.deregister(this);
this._scrollStart.unsubscribe();
this._scrollEnd.unsubscribe(); // only stop listening to content scroll events if there is content
if (this._content) {
this._scrollStart.unsubscribe();
this._scrollEnd.unsubscribe();
}
} }
/** /**

View File

@ -0,0 +1,31 @@
import { Component, NgModule } from '@angular/core';
import { IonicApp, IonicModule } from '../../../..';
@Component({
templateUrl: 'main.html'
})
export class E2EPage {
}
@Component({
template: '<ion-nav [root]="rootPage"></ion-nav>'
})
export class E2EApp {
rootPage = E2EPage;
}
@NgModule({
declarations: [
E2EApp,
E2EPage
],
imports: [
IonicModule.forRoot(E2EApp)
],
bootstrap: [IonicApp],
entryComponents: [
E2EPage
]
})
export class AppModule {}

View File

@ -0,0 +1 @@

View File

@ -0,0 +1,17 @@
<ion-header>
<ion-navbar>
<ion-title>Inputs in footer</ion-title>
</ion-navbar>
</ion-header>
<ion-content padding>
<p>TextInput and TextArea components should work outside of a Content component.</p>
</ion-content>
<ion-footer>
<ion-input></ion-input>
<ion-textarea></ion-textarea>
</ion-footer>