App.router.navigate() not working in start App

I am having problems with the application routes, I am trying to put an action that when the user opens the application it is redirected to the Login screen.

Example my code:

var Index = {

    //Application Constructor
    initialize: function() {

    //Bind Event Listeners
    bindEvents: function() {
        document.addEventListener('deviceready', this.onDeviceReady, false);
        document.addEventListener("resume", this.onResume, false);

    //Event Handle
    onDeviceReady: function() {        

    //Event Handle
    onResume: function() {



The alert is displayed, but my route does not work …No error is displayed on the console. But, if on the console I put “app.router.navigate(’/login/’)” in this case the screen is redirected for o Login.

I recently tried another method that I saw, which is adding within the application instance the check, I did this way:

// Init App
var app = new Framework7({
  id: '',
  root: '#app',
  theme: theme,
  data: function () {
    return {
      //url: '',
      name: '',
  dialog: {    
    title: 'Alerta',    
    buttonOk: 'Sim',    
    buttonCancel: 'Não', 
  methods: {
    error: function (http) {
      if(http.response != '' && http.response.indexOf('message') > 0){
        var json = JSON.parse(http.response);
        app.dialog.alert('Ops, ocorreu algum problema para realizar a conexão, tente novamente em instantes.');
  on: {
      pageInit: function() {         
  routes: routes,

But not work… Any solution???

Use initial route technik to load required initial route

1 Like

I understood, but should not it work?

I say this because in the future I can have 3 types of checks, and certain type I’m going to forward to a page. But this redirection will be the moment you open the page.

Today, just using for login will partially solve, but in the future the situation I mentioned above will be a problem.

You need try the receipt:

  1. Set init parameter off your app to false (disable auto init, maybe initOnDeviceReady too) and DISABLE view auto init in your layout.
  2. Create your main view with conditions, e.g.:

var mainView;
…next in your pre-init code…
mainView = app.views.create(’.view-main’, {
url: yourCondition ? ‘/custompage1/’ : ‘/custompage2/’ /* or custom3, custom4… */

  1. Call init of your app manually:

$$(document).on(‘deviceready’, function () {

If you application contains any starter pages with dependencies from any external data or internal data (async) I not see other ways.

Calling router.navigate redirect may not work in pageInit and this is not a good practise. Then you can just use async route for home page where you can do as many checks as you need and return appropriate page