2016-08-18 48 views
0

我正在使用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 
    }); 
    } 
} 

回答

0

Here是解决方案。

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