Despite my efforts to find a solution online, I am stuck on a fairly basic issue. The router/index.html page I am working with appears to be correct, as there are no errors in the console. However, when the URL redirects to the login page, the entire page is blank. Can anyone spot what might be missing in the code below?
router
(function(){
'use strict'
var app = angular.module('app.core');
app.config(AppRouter);
AppRouter.$inject = ['$stateProvider', '$urlRouterProvider'];
function AppRouter($stateProvider, $urlRouterProvider){
$urlRouterProvider.otherwise('/login');
$stateProvider
.state('main', {
url: '/main',
abstract: true,
resolve:{
Config: 'Config',
config: function(Config){
console.log(Config);
return Config;
}
}
})
.state('main.login', {
url: '/login',
templateUrl: 'app/components/login/login.html',
controller: 'LoginController',
controllerAs: 'vm',
reloadOnSearch: false
})
}
})();
index.html
<div class="slide-animation-container">
<div ui-view id="ng-view" class="slide-animation"></div>
{{scrollTo}}
</div>
login.html
<div class="container" ui-view>
<div class="row vertical-center-row">
<form id="loginForm" class="form-signin" style="max-width:300px;" autocomplete="off" ng-if="attemptLogin">
<h2 class="form-signin-heading" style="font-size:22px">Please Sign In</h2>
<div class="input-group">
<span class="input-group-addon"><i class="fa fa-user"></i></span></span>
<input type="text" class="form-control" id="username" placeholder="User Name" ng-model="user.username" required>
</div>
</form>
</div>
</div>
EDIT
The router above is part of my config.js file for my core module:
core.module.js
(function(){
'use strict'
angular.module('app.core', ['angulartics', 'angulartics.google.analytics', 'angulartics.scroll', 'ngRoute', 'ngAnimate', 'ng.deviceDetector', 'ui.router',
'ui.bootstrap', 'ngTable', 'ngSanitize', 'ngCsv', 'toastr', 'angular.chosen', 'rzModule', 'publicServices']);
})();