mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-23 14:01:20 +08:00
fix(input): prevent exception when input components outside Content
This commit is contained in:

committed by
Adam Bradley

parent
4f61ea5f9b
commit
e80f4cf88d
@ -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,6 +75,8 @@ export class InputBase extends Ion implements IonicFormInput {
|
|||||||
|
|
||||||
_form.register(this);
|
_form.register(this);
|
||||||
|
|
||||||
|
// only listen to content scroll events if there is content
|
||||||
|
if (_content) {
|
||||||
this._scrollStart = _content.ionScrollStart.subscribe((ev: ScrollEvent) => {
|
this._scrollStart = _content.ionScrollStart.subscribe((ev: ScrollEvent) => {
|
||||||
this.scrollHideFocus(ev, true);
|
this.scrollHideFocus(ev, true);
|
||||||
});
|
});
|
||||||
@ -82,6 +84,7 @@ export class InputBase extends Ion implements IonicFormInput {
|
|||||||
this.scrollHideFocus(ev, false);
|
this.scrollHideFocus(ev, false);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
scrollHideFocus(ev: ScrollEvent, shouldHideFocus: boolean) {
|
scrollHideFocus(ev: ScrollEvent, shouldHideFocus: boolean) {
|
||||||
// do not continue if there's no nav, or it's transitioning
|
// do not continue if there's no nav, or it's transitioning
|
||||||
|
@ -240,9 +240,13 @@ export class TextInput extends InputBase {
|
|||||||
*/
|
*/
|
||||||
ngOnDestroy() {
|
ngOnDestroy() {
|
||||||
this._form.deregister(this);
|
this._form.deregister(this);
|
||||||
|
|
||||||
|
// only stop listening to content scroll events if there is content
|
||||||
|
if (this._content) {
|
||||||
this._scrollStart.unsubscribe();
|
this._scrollStart.unsubscribe();
|
||||||
this._scrollEnd.unsubscribe();
|
this._scrollEnd.unsubscribe();
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @private
|
* @private
|
||||||
@ -410,9 +414,13 @@ export class TextArea extends InputBase {
|
|||||||
*/
|
*/
|
||||||
ngOnDestroy() {
|
ngOnDestroy() {
|
||||||
this._form.deregister(this);
|
this._form.deregister(this);
|
||||||
|
|
||||||
|
// only stop listening to content scroll events if there is content
|
||||||
|
if (this._content) {
|
||||||
this._scrollStart.unsubscribe();
|
this._scrollStart.unsubscribe();
|
||||||
this._scrollEnd.unsubscribe();
|
this._scrollEnd.unsubscribe();
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @private
|
* @private
|
||||||
|
31
src/components/input/test/footer-inputs/app-module.ts
Normal file
31
src/components/input/test/footer-inputs/app-module.ts
Normal 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 {}
|
1
src/components/input/test/footer-inputs/e2e.ts
Normal file
1
src/components/input/test/footer-inputs/e2e.ts
Normal file
@ -0,0 +1 @@
|
|||||||
|
|
17
src/components/input/test/footer-inputs/main.html
Normal file
17
src/components/input/test/footer-inputs/main.html
Normal 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>
|
Reference in New Issue
Block a user