I have an application where certain sections used to be a series of routes in a nested ui-view.
In other words:
feedback.html--
|--feedback-alerts.html
|--feedback-progress.html
And so on, maybe 5-6 pages per section like this. On the main page was a sub-nav menu and a ui-view to hold the views as clicked in the menu. It works fine.
Problem is, now my client would prefer to see ALL these subdocuments on the one page, and simply have the sub-menu links scroll down to each sub-section as clicked!
I would rather keep these templates separate. I realize I can do ng-include
s, and I might still, but I was wondering if there was some way to have the all-on-one-page experience with the views I have...
Here's my routes, with a few redundant ones removed.
(function() {
'use strict';
angular.module('pb.ds.feedback').config(function($stateProvider) {
$stateProvider.state('feedback', {
abstract: true,
url: '/feedback',
templateUrl: 'modules/feedback/templates/feedback.html',
controller: 'FeedbackController as feedback',
data: {
pageTitle: 'feedback',
access: 'public',
bodyClass: 'feedback'
}
})
.state('feedback.alerts', {
url: '/alerts',
templateUrl: 'modules/feedback/templates/feedback-alerts.html',
controller: 'AlertsController as alerts'
})
.state('feedback.headermessage', {
url: '/headermessage',
templateUrl: 'modules/feedback/templates/feedback-header-message.html',
controller: 'HeaderMessageController as message'
});
});
})();