Valor_ Valor_ - 1 year ago 92
AngularJS Question

$stateprovider doesn't work or show any kind of errors

I can't figure out why my angular state provider doesn't work and it doesn't show no errors. Previously when i used ngRoute everything was working but now when i included

nothing seems to work. Previously once i opened application, /#/ link was generated (routed), but now it just hangs on

my HTML index.html

<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<style type="text/css">
[ng\:cloak], [ng-cloak], .ng-cloak {
display: none !important;
<body class="hold-transition skin-blue sidebar-mini" ng-app="app">
<div class="wrapper">
<div class="content-wrapper">
<div ng-view></div>
</div><!-- /.content-wrapper -->
<script src="plugins/angularJs/angular.js"></script>
<script src="plugins/angularJs/angular-ui-router.js"></script>
<script src="plugins/angularJs/angular-resource.js"></script>
<script src="plugins/angularJs/ui-bootstrap-tpls-1.3.2.js"></script>
<script src="app/app.js"></script>
<!-- Controllers -->
<script src="app/controllers/locations/locationsCtrl.js"></script>
<script src="app/controllers/dashboard/dashboardCtrl.js"></script>
<!-- Factories -->
<script src="app/factories/locationFactory.js"></script>
<script src="app/factories/countriesFactory.js"></script>
<script src="app/factories/provincesFactory.js"></script>
<!-- Filters -->
<script src="app/filters/selectionFilters.js"></script>

my dashboard.html

<!-- Content Header (Page header) -->
<section class="content-header">
<ol class="breadcrumb">
<li><a href="/"><i class="fa fa-dashboard"></i>Home</a></li>
<li class="active">Dashboard</li>
<!-- Main content -->
<section class="content">

my app.js

var app = angular.module('app', ['ui.router', 'ui.bootstrap']);

app.config(function($stateProvider, $urlRouterProvider){
.state('dashboard', {
url: "/dashboard",
templateUrl: "app/templates/dashboard/dashboard.html",
controller: 'dashboardCtrl'
.state('locations', {
url: "/locations",
templateUrl: "app/templates/locations/locations.html",
controller: 'locationsCtrl'
.state('/locations/add_location', {
url: "/locations/add_location",
templateUrl: "app/templates/locations/add_location.html",
controller: 'addLocationCtrl'


Interface and console output
Loaded files
enter image description here
I hope you guys know what is going on or what am i missing. If you need any additional information's please let me know and i will provide.

Answer Source

Try add

<base href="/">

in your HTML Head and


in your route config.

By the way, use dot syntax . not / in state declaration:

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download