After switching the routing in my app from ngRoute to ui-router, I encountered two errors:
- SyntaxError: Unexpected string
- Uncaught Error: [$injector:unpr]
Here is the updated config.route.js:
(function () {
var app = angular.module('app');
//Define the routes
app.constant('routes', getRoutes());
app.config(['$stateProvider', '$urlRouterProvider', 'routes', routeConfigurator]);
function routeConfigurator('$stateProvider', '$urlRouterProvider', routes) {
routes.forEach(function (r) {
$stateProvider.state(r.url, r.config);
});
$urlRouterProvider.otherwise('/');
}
//Collect the routes
function getRoutes() {
return [
{
url: '/',
config: {
templateUrl: 'app/components/dashboard/test/dashboard.html',
title: 'dashboard',
settings: {
nav: 1,
content: '<i class="fa fa-dashboard"></i> Dashboard'
}
}
}, {
url: '/admin',
config: {
title: 'admin',
templateUrl: 'app/components/admin/admin.html',
settings: {
nav: 2,
content: '<i class="fa fa-lock"></i> Admin'
}
}
}
];
}
})();
Previously, the configuration was as follows and it was functioning correctly:
app.config(['$routeProvider', 'routes', routeConfigurator]);
function routeConfigurator($routeProvider, routes) {
routes.forEach(function (r) {
$routeProvider.when(r.url, r.config);
});
$routeProvider.otherwise({ redirectTo: '/' });
}
The ui-router module has been properly referenced in app.js, and the angular-ui-router.min.js file is loading successfully in index.html. Can anyone point out what mistake I might be making? Your assistance would be greatly appreciated!