在Angular-Ionic中,通过路由加载页面时,默认情况下会将先前的选项卡加载出来,而不是所选的选项卡。这是因为Ionic使用了路由缓存机制,以提高应用性能。
要解决这个问题,可以使用Ionic的NavController的select()
方法来手动选择所选的选项卡。下面是一个示例代码:
import { Component } from '@angular/core';
import { NavController, Tabs } from 'ionic-angular';
@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {
constructor(public navCtrl: NavController) {}
goToTab(tabIndex: number) {
const tabs: Tabs = this.navCtrl.parent; // 获取父级NavController,即Tabs组件
tabs.select(tabIndex); // 选择所选的选项卡
}
}
在上面的代码中,我们将NavController注入到了HomePage组件中,并使用goToTab()
方法来选择所选的选项卡。你可以在需要选择选项卡的地方调用该方法,并传入选项卡的索引。
请注意,上述代码假设HomePage是一个位于Tabs组件中的页面。如果你的情况不同,请相应地调整代码。
希望对你有帮助!