Slide Menu to Tabs Issue

@markbbishop wrote:

I'm designing an app with tabs, and purchased an app with some coding I wanted to put in my app but it uses a side menu. I'm still learning Ionic and Angular, so I'm a bit confusing how to do it. Here is my code in app.js:

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

  // Ionic uses AngularUI Router which uses the concept of states
  // Learn more here: https://github.com/angular-ui/ui-router
  // Set up the various states which the app can be in.
  // Each state's controller can be found in controllers.js
  $stateProvider

  // setup an abstract state for the tabs directive
    .state('tab', {
    url: '/tab',
    abstract: true,
    templateUrl: 'templates/tabs.html'
  })

  // Each tab has its own nav history stack:

  .state('tab.watch', {
    url: '/watch',
    views: {
      'tab-watch': {
        templateUrl: 'templates/tab-watch.html',
      }
    }
  })
    .state('tab.events', {
      url: '/events',
      views: {
        'tab-events': {
          templateUrl: 'templates/tab-events.html',
        }
      }
    })
    .state('tab.event', {
      url: '/events/:eventId',
      views: {
        'tab-event': {
          templateUrl: 'templates/tab-event.html',
          controller: 'EventCtrl'
        }
      }
    })
    .state('tab.categories', {
      url: '/category',
      views: {
        'tab-categories': {
          templateUrl: 'templates/categories.html',
        }
      }
    })
    .state('tab.postC', {
      url: '/category/:category',
      views: {
        'tab-postsc': {
          templateUrl: 'templates/tab-postsc.html',
          controller: 'PostCtrl'
        }
      }
    })
    .state('tab.singlepost', {
      url: '/post/:postId',
      views: {
        'tab-singlepost': {
          templateUrl: 'templates/singlepost.html',
          controller: 'SinglePostCtrl'
        }
      }
    })
  .state('tab.contact', {
      url: '/contact',
      views: {
        'tab-contact': {
          templateUrl: 'templates/tab-contact.html',
        }
      }
    })
    .state('tab.give', {
      url: '/give',
      views: {
        'tab-give': {
          templateUrl: 'templates/tab-give.html',
        }
      }
    })
   .state('app.news', {
      url: '/cateogory/:categoryId',
      views: {
        'news': {
          templateUrl: 'templates/news.html',
           controller: 'CategoryCtrl'
        }
      }
    })
  .state('tab.home', {
    url: '/home',
    views: {
      'tab-home': {
        templateUrl: 'templates/tab-home.html',
      }
    }
  });

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

});

and here is the code I purchased that I want to use in my app template:

.config(function($stateProvider, $urlRouterProvider, $ionicConfigProvider, CacheFactoryProvider, POSTS_TEMPLATE) {

    angular.extend(CacheFactoryProvider.defaults, {
        'storageMode': 'localStorage',
        'capacity': 10,
        'maxAge': 10800000,
        'deleteOnExpire': 'aggressive',
        'recycleFreq': 10000
    })

    // Native scrolling
    if (ionic.Platform.isAndroid()) {
        $ionicConfigProvider.scrolling.jsScrolling(false);
    }

    $stateProvider

    // Sets up our default state, all views are loaded through here
        .state('app', {
        url: "/app",
        abstract: true,
        templateUrl: "templates/menu.html",
        controller: 'AppCtrl'
    })

    .state('app.posts', {
        url: "/posts",
        views: {
            'menuContent': {
                templateUrl: "templates/posts/" + POSTS_TEMPLATE + ".html",
                controller: 'PostsCtrl'
            }
        }
    })

    .state('app.bookmarks', {
        url: "/bookmarks",
        views: {
            'menuContent': {
                templateUrl: "templates/bookmarks.html",
                controller: 'BookmarksCtrl'
            }
        }
    })

    .state('app.post', {
        url: "/posts/:postId",
        views: {
            'menuContent': {
                templateUrl: "templates/post.html",
                controller: 'PostCtrl'
            }
        }
    })

    .state('app.category', {
        url: "/categories/:categoryId",
        views: {
            'menuContent': {
                templateUrl: "templates/category.html",
                controller: 'CategoryCtrl'
            }
        }
    })

    .state('app.search', {
        url: "/search/:request",
        views: {
            'menuContent': {
                templateUrl: "templates/search.html",
                controller: 'SearchCtrl'
            }
        }
    })

    .state('app.settings', {
        url: "/settings",
        views: {
            'menuContent': {
                templateUrl: "templates/settings.html",
                controller: 'SettingsCtrl'
            }
        }
    })

    .state('app.about', {
        url: "/about",
        views: {
            'menuContent': {
                templateUrl: "templates/about.html"
            }
        }
    });
    // if none of the above states are matched, use this as the fallback
    $urlRouterProvider.otherwise('/app/posts');
});

Posts: 1

Participants: 1

Read full topic