从弹出窗口滚动不起作用

Question

我正在使用 Ionic 2。

我有一个页面，当我从另一个页面导航到该页面时，它可以完美滚动。但是，当我从 Popover 导航到该页面时，该页面会显示，但我无法滚动。

有什么想法吗？

从Popover导航到页面和其他页面是一样的：

this.nav.push(CategoryPage, {
  employeeModel: this.employeeModel,
  fromSearch: true
});

页面：

<ion-header>
  <ion-navbar>
    <ion-title>{{categoryModel.name}}</ion-title>
  </ion-navbar>
</ion-header>


<ion-content padding>

  <center>
    <ion-spinner icon="android" *ngIf="loading"></ion-spinner>

    <div class="category-text animate-show">
      <div class="select-text" *ngIf="getSelected().length === 0">Select the Roles</div>
      <p class="item-selected-row" *ngFor="let subcategory of getSelected()">
        <img class="item-stable" id="icon-image-{{subcategory.id}}" src="{{subcategory.icon}}" (click)="toggleItem(subcategory)"/>
      </p>
    </div>
  </center>

  <ion-row *ngFor="let trio of getTriples()">
    <ion-col *ngFor="let item of trio">
      <center>
        <div class="row responsive-md">
          {{ formatSubCategories(item) }}
          <img class="item-stable-large" id="icon-image-{{item.id}}" src="{{item.icon}}" (click)="toggleItem(item)"
            [class.item-selected]="isSubCategoryModelItemInArray(item) > -1" />
          <p>{{item.name}}</p>
        </div>
      </center>
    </ion-col>
  </ion-row>

  <ion-buttons>
    <button (click)="next()" block round class="form-button-text">Next</button>
  </ion-buttons>

</ion-content>

弹出框

import {Component, ViewChild, ElementRef} from '@angular/core';
import {App, PopoverController, NavController, Content, NavParams} from 'ionic-angular';
import {NgForm} from '@angular/forms'
import { MapPage } from '../map/map';
import { CategoryPage } from '../category/category';
import { EmployeeModel } from '../model/employeeModel';

@Component({
  template: `
    <ion-content padding id="search-popover">
      <ion-list>
        <ion-row>
          <ion-col>
            <center>
              <div id="pinButton"><button class="search-popover-button" (click)="presentFilterMap()" danger><ion-icon class="search-popover-icon" name="pin"></ion-icon></button></div>
              <p>Location</p>
            </center>
          </ion-col>
          <ion-col>
            <center>
              <div id="pinButton"><button class="search-popover-button" (click)="presentFilterCategories()" primary><ion-icon class="search-popover-icon" name="happy"></ion-icon></button></div>
              <p>Sectors</p>
            </center>
          </ion-col>
        </ion-row>
      </ion-list>
    </ion-content>
  `
})
export class SearchPopOverPage {
  private nav: NavController = null;
  private employeeModel: EmployeeModel = null;

  constructor(private navParams: NavParams, nav: NavController) {
    this.nav = nav;
    this.employeeModel = navParams.get('employeeModel');
  }

  ngOnInit() {

  }

  presentFilterMap(event: Event) {
    this.nav.push(MapPage, {
      employeeModel: this.employeeModel,
      fromSearch: true
    });
  }

  presentFilterCategories(event: Event) {
    this.nav.push(CategoryPage, {
      employeeModel: this.employeeModel,
      fromSearch: true
    });
  }
}

Answer 1

Here 是解决方案。

  presentFilterCategories(event: Event) {
    this.viewCtrl.dismiss().then(() => {
      this.nav.push(CategoryPage, {
        ev: event,
        employeeModel: this.employeeModel,
        fromSearch: true
      })
    });
  }