从Popover滚动不起作用

时间:2016-08-18 13:32:00

标签: javascript html angular ionic-framework ionic2

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

1 个答案:

答案 0 :(得分:0)

Here是解决方案。

elem.on('$destroy', function() {               
                elem.off();
                $log.info('Inside destroy..' + elem);
            });

            scope.$on('$destroy', function() {
                scope = {};                
                $log.info("In destroy of:" + scope);
            });