Problem with routing with more than 2 pages

Good morning,

I have a problem using routes.

I have an app with 4 tabs below (Home, News, Profile, Activity).

I want to route to a template on the profile page, named “Profile_Settings”. So when the user clicks a button on the profile, he should get to the profile settings. If he is at the profile settings, then he can click on a button again and then he should be at “SoftwareHistory” based on a route.

So Profile(Tab) -> Profile Settings -> Software History.

Here the user should always be able to go back, so for example I’m at SoftwareHistory and click back then I’m at the Profile Settings. So far it only works that I can go from Profile to Profile Setttings. From Profile Settings to SoftwareHistory does not work. But I can see that in HTML a “page page-next” element is created with the elements of the SoftwareHistory that is declared in the routes. But the SoftwareHistory page is not displayed.

I’ve added

view: {
stackPages:true,
},

to the app settings.

My routes:

{
name:“profileSettings”,
path:"/profileSettings/",
url:"./templates/profileSettings.html",
},
{
name:“softwareHistory”,
path:"/softwareHistory/",
url:"./templates/softwareHistory.html",
},

The Profile Tab in the index.html:

  <div id="view-profile" class="view view-init tab" data-view="profil" data-url="/profil/">
    <div class="page" data-name="profile">
      <div class="navbar">
        <div class="navbar-bg"></div>
        <div class="navbar-inner">
          <div class="title">Profile</div>
        </div>
      </div>
      <div class="page-content infinite-scroll-content">
        <div class="list inset">
          <ul id="profile-list">
          </ul>
        </div>
      </div>
    </div>
  </div>
</div>

JAVASCRIPT:

First route:

var view = app.views.get(“view-profile”);
view.router.navigate("/profileSettings/");

Second route:

var view = app.views.get(“view-profile”);
view.router.navigate("/softwareHistory/");