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

View File

@ -240,8 +240,12 @@ export class TextInput extends InputBase {
*/
ngOnDestroy() {
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() {
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>