# Problem with tabbed views

**URL:** <https://forum.ionicframework.com/t/problem-with-tabbed-views/140600>\
**Category:** ionic-v3\
**Created:** [September 3, 2018, 4:18pm UTC](https://forum.ionicframework.com/t/problem-with-tabbed-views/140600 "2018-09-03T16:18:03Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Telesforo](https://avatars.discourse-cdn.com/v4/letter/t/e95f7d/32.png) [@Telesforo](https://forum.ionicframework.com/u/Telesforo)\
**Post date:** [September 3, 2018, 4:18pm UTC](https://forum.ionicframework.com/t/problem-with-tabbed-views/140600/1 "2018-09-03T16:18:03Z")

</div>

Hi there!

Let’s introduce you the situation:  
I have two different pages and each one has [tabs like described in the docs](https://ionicframework.com/docs/components/#tabs):

**Page A**

```auto
<ion-tabs #tabs color="primary" tabsPlacement="top">
  <ion-tab [root]="transactions" tabTitle="Transactions"></ion-tab>
  <ion-tab [root]="invoices" tabTitle="Invoices"></ion-tab>
  <ion-tab [root]="payment" tabTitle="Payment methods"></ion-tab>
</ion-tabs>

```

**Page B**

```auto
<ion-tabs #tabs color="primary" tabsPlacement="top">
  <ion-tab [root]="agenda" tabTitle="Agenda"></ion-tab>
  <ion-tab [root]="requests" tabTitle="Requests"></ion-tab>
  <ion-tab [root]="history" tabTitle="History"></ion-tab>
</ion-tabs>

```

When displaying one of those tabs, it is represented in the URL bar as:

```auto
in "Page A":
localhost:8080/#/page-a/transactions/page-a-transactions
[...]
or in "Page B":
localhost:8080/#/page-b/agenda/page-b-agenda
[...]

```

**The problem is:**  
When changing from **Page A** to **Page B** or viceversa, the tabs are changed to each page’s tabs, but the tab content remains the same as the previous page. The tab content as well as the last part of the URL displayed is not changed until you click the tab you want to view again.

**For example, I am at:**

```auto
localhost:8080/#/page-a/transactions/page-a-transactions

```

Then I click on a button which calls `navCtrl.setRoot('page-b')`, so **I expect** it to go to `page-b` and displays the content from `page-b-agenda`, which is the first tab from `page-b`. Instead of it, I get the tabs changed to `page-b`'s tabs and the content from `page-a-transactions`, and the URL look like this:

```auto
localhost:8080/#/page-b/agenda/page-a-transactions

```

Could you identify what am I doing wrong?  
Thanks in advance!

---

<div class="post-metadata">

**Author:** ![Telesforo](https://avatars.discourse-cdn.com/v4/letter/t/e95f7d/32.png) [@Telesforo](https://forum.ionicframework.com/u/Telesforo)\
**Post date:** [October 17, 2018, 5:13pm UTC](https://forum.ionicframework.com/t/problem-with-tabbed-views/140600/2 "2018-10-17T17:13:15Z")

</div>

Any suggestions? I’ve tried everything 😰

---

<div class="post-metadata">

**Author:** ![mhartington](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/mhartington/32/137757_2.png) [@mhartington](https://forum.ionicframework.com/u/mhartington)\
**Post date:** [July 19, 2021, 9:18pm UTC](https://forum.ionicframework.com/t/problem-with-tabbed-views/140600/3 "2021-07-19T21:18:08Z")

</div>

Closed on July 19, 2021, 9:18pm UTC