How to Load First Page in Ionic Framework based on Condition

I am newbie to Ionic Framework, for developing mobile application.

This is the scenario:

When user open application for the first time (window.localStorage.getItem("pin")==null) it shows form to input PIN then store it as "pin" in LocalStorage.

When user open it for the second time (window.localStorage.getItem("pin")!=null) it shows dashboard page.

How can I achieve this?

I use "tabs" template from CLI "ionic start ionicApp tabs".

I have modified this in bottom of app.js:

if (window.localStorage.getItem("pin")==null) {
    $urlRouterProvider.otherwise('/pin/set');
  } else {
    $urlRouterProvider.otherwise('/tab/dash');
  }

Added this in head of app.js:

.state('pin.set', {
    url: '/pin/set',
    views: {
      'pin-set': {
        templateUrl: 'templates/pin-set.html',
        controller: 'PinSetCtrl'
      }
    }
  })

Added this in controllers.js:

.controller('PinSetCtrl', function($scope) {})

Based on my codes above, it only display blank page, not display "pin-set.html".

Please help, many thanks.

First of all, app.js ment only for the routes of your application's pages so you shouldn't put any type of code there other then the routes itself.

you should try to do something like this in your home controller(with the param $state in it):

if(window.localStorage.getItem('firstTime') == null) //if first time
    $state.go('app.signUp'); //go to sign up view.
else
    $state.go('app.signIn'); //if not first time go to sign in view.