Ionic, ui-sref, how to synchronize two views?


#1

Hi,

in my Ionic app I have three tabs: Theory, Example, About. The first two have a menu with items “Lesson 1”, “Lesson 2”, …
I need to synchronize two tabs (views): Theory and Example. When I choose item2 from menu (on Theory tab or Example tab), I need to change state for both tabs - so when I change tab from Theory to Example, I need item2 to be active (synchronized).

Due to problems with dynamic content inside ui-sref directive, I have now two menus with ng-show condition.

Here is my code: Ionic Play example

Thanks to help!


#2

I have solution!

The main idea: configuration of states.

.state('tabs.Theory-L1', {
  url: "/Theory-L1",
  views: {
    '': {},
    'theory-tab@tabs': {
      templateUrl: "Theory-L1.html"
    },
    'example-tab@tabs': {
      templateUrl: "Example-L1.html"
    }
  }
})

Here is my code: Ionic Play Example