Setting up the application's routes

app.js

...

  .config(function($stateProvider, $urlRouterProvider) {

    $stateProvider
      .state('app', {
        url: '/app',
        templateUrl: 'templates/side-menu-template.html',
        controller: 'SideMenuController',
        abstract: true
      })

      .state('app.main', {
        url: '/main',
        views: {
          'menuContent': {
            templateUrl: 'templates/main-template.html',
            controller: 'MainController',
            resolve: {
              posts: function(PostsService) {
                return PostsService.findPosts();
              }
            }
          }
        }
      })

      .state('app.preview', {
        url: '/preview/:postId',
        views: {
          'menuContent': {
            templateUrl: 'templates/preview-template.html',
            controller: 'PreviewController',
            resolve: {
              post: function($stateParams, PostsService) {
                return PostsService.findPostById($stateParams.postId);
              }
            }
          }
        }
      })

      .state('app.editor', {
        url: '/editor/:postId',
        views: {
          'menuContent': {
            templateUrl: 'templates/editor-template.html',
            controller: 'EditorController',
            resolve: {
              post: function($stateParams, PostsService) {
                return PostsService.findPostById($stateParams.postId);
              }
            }
          }
        }

      });

    // if none of the above states are matched, use this as the fallback
    $urlRouterProvider.otherwise('/app/main');
  })
  
...