私たちはionicでリスティングページとフィルタページを持っていますアプリ。フィルタページには、テキストボックスオートコンプリートとドロップダウンがあります。テキストボックスオートコンプリートイオンコンテンツでフィルタリングしようとすると、以下のスナップショットに示すようにイオンヘッダーの内部に入ります。
Textbox-Autocomplete html：
<input type="text" [(ngModel)]="selectedTitle" (input)="getTitles($event)" placeholder="search titles" />
<ion-list *ngFor="let title of titles">
<ion-item tappable (click)=selectTitle(title.VNAME)>
{{title.VNAME}}
</ion-item>
</ion-list>
filter.htmlとtestPage.htmlをこのplunkerに入れました。 https://plnkr.co/edit/FASHAxUAJwcz9XYeKDqj?p=catalogue
イオン情報：
@ionic/cli-utils : 1.14.0
ionic (Ionic CLI) : 3.14.0
global packages:
cordova (Cordova CLI) : 7.0.1
local packages:
@ionic/app-scripts : 3.0.1
Cordova Platforms : android 6.2.3
Ionic Framework : ionic-angular 3.7.1
System:
Node : v6.9.5
npm : 3.10.10
OS : Windows 10
Misc:
backend : legacy
この問題は、最新のバージョンのIonic情報を使用している場合に発生しています。古いバージョンのIonic情報は正常に機能しています。
@ionic/cli-utils : 1.9.1
ionic (Ionic CLI) : 3.9.1
global packages:
Cordova CLI : 7.0.1
local packages:
@ionic/app-scripts : 1.3.3
Cordova Platforms : android 6.2.3
Ionic Framework : ionic-angular 3.5.3
System:
Node : v6.9.5
npm : 3.10.10
OS : Windows 10
誰もこの問題を解決するために私たちを導くことができますか？
回答：
回答№1は0私は以下のコードを使用してイオン含有量をリサイズして解決策を得ました：
import { Component,ViewChild } from "@angular/core";
import { Content } from "ionic-angular";
export class TestPage {
@ViewChild(Content) content: Content;
......
Events.subscribe("applyFilter", (data) => {
this.content.resize();
}