Question

我正在使用离子3角度和构建Web应用程序。我有一个要求是一个标签组件，第一个标签显示一个列表。单击每个列表项会创建一个新选项卡并显示一些内容。

我实施它的方式是：

<ion-tabs #myTabs tabsPlacement="top" tabsLayout="icon-end">
  <ion-tab *ngFor="let tb of core.dynamicTabs" [root]="tb.pageName" tabTitle="{{tb.tabTitle}}" tabIcon="close" (ionSelect)="onTabActive($event)"></ion-tab>
</ion-tabs>

我保留一个共享数组来存储与标签相关的数据，例如

@Injectable()
export class CoreStructureProvider {
  dynamicTabs: any[];

  constructor(public http: Http) {
    this.dynamicTabs = [{ "pageName": MyListPage, "tabTitle": rw.name, "optyId": rw.OptyId }];
  }
}

因此，从第一个标签页面开始，创建新标签的代码为：

createTab(rw){
  this.core.dynamicTabs.push({ "pageName": EditOptyPage, "tabTitle": rw.name, "optyId": rw.OptyId });
  (this.navCtrl.parent).select(1)

}

除标签选择外，一切都很好。只是为了简化问题我将值硬编码为1.因此理想情况下，每次调用createTab时都应该选择第二个选项卡。

但这是我所看到的行为：当你第一次来的时候：只有一个显示列表的标签。单击列表中的一个项目，将创建一个新选项卡。但是这不会成为活动标签。

现在再次单击列表中的任何其他链接，这一次从现在开始第二个选项卡变为活动状态。

所以我不确定为什么第一次这不会触发？

Answer 1

根据对离子论坛的一些研究，人们表明设置标签的摘要存在问题。所以你必须在将来异步调用你的方法

setTimeout(()={(this.navCtrl.parent).select(1)},100);

100只是我选择的随机数。

离子3：动态创建标签并选择它

1 个答案: