Question

1 我有一个产品页面，其中包含选项列表。

2 点击后，会打开一个新页面，其中列出了所有选项。

3 当我点击某个选项（例如“黑色”）时，我希望该页面返回到产品，但是在选择了新选项的情况下更新页面。这看起来很有效，但我无法在页面上滚动或选择任何内容。

（出于某种原因，产品变体页面显示在新产品页面上，这就是我无法选择任何内容或滚动的原因）

4 当我再次回到产品详情页面时，我感到很乱。

查看

<ion-item *ngFor="#option of productData">
    <ion-label>{{option.val}}</ion-label>
    <ion-radio (click)="goToProduct($event, option.catalogId)" [checked]="option.val == selected"></ion-radio>
</ion-item>

功能

goToProduct(event, catalogId) {
  this.nav.push(ProductPage, {
    catalogId: catalogId
  },{
    direction: 'back'
  });
}

我认为我需要删除较旧的产品页面，所以我在做：

goToProduct(event, catalogId) {
  this.nav.remove(1);
  this.nav.push(ProductPage, {
    catalogId: catalogId
  },{
    direction: 'back'
  });
}

像这样的各种变化，但没有任何效果。

我知道Ionic 2仍处于测试阶段，这是一个众所周知的问题吗？或者我错过了什么？如何在不破坏我的应用程序的情况下选择一个选项并使更新的页面方向倒退？

Answer 1

如果我使用insert()代替push()，则会根据需要反向更新产品，并完全删除旧产品页面。我没有通过阅读文档来预期这种行为，但我认为这是一个很好而且简单的解决方案。

goToProduct(event, catalogId) {
  this.nav.insert(1, ProductPage, {
    catalogId: catalogId
  },{
    direction: 'back'
  });
}

Answer 2

我很感谢上面的回答，这对我帮助很大我需要应用我已经完成的<应用页面的转换，但有一个问题是 -

当我回来的时候，某些时间点某些页面重叠。
在做了一些搜索后，我解决了这个问题。

这是我的代码 -

goBack() {
    {
      this.nav.insert(0,MyPage, {
        PId: this.parentId
      },{direction: 'back'});
    }

    {
      this.nav.pop();
    }
  }

我们也可以使用{direction: 'forward'}根据我们的要求我只需用0参数替换1并为我工作。

度过愉快的一天!!!

Ionic 2 push（）方向：'back'选项无法正常工作

2 个答案: