Sam Palmer Sam Palmer - 2 months ago 12
AngularJS Question

Angular JS UI-Router Example not working

I'm new to JS, and am trying out a simple Angular ui-router example, but I can't seem to get the router working, and can't see why. I've tested a few examples to make sure angular has been loaded and custom.js has been loaded (which they are), but when I come to using the router I get nothing, from my little knowledge I can't see anything glaringly obvious (this is basically and copy and paste example).

--HTML---

<!DOCTYPE html>
<html ng-app = "routerApp">
<head>
<title></title>
<script src="js/angularmin.js"></script>
<script src="js/custom.js"></script>
</head>
<body>
TEST APP
<div ui-view></div>


</body>
</html>


--js/custom.js--

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

routerApp.config(function($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('/home');
$stateProvider

// HOME STATES AND NESTED VIEWS ========================================
.state('home', {
url: '/home',
templateUrl: 'home-partial.html'
})

// ABOUT PAGE AND MULTIPLE NAMED VIEWS =================================
.state('about', {
// we'll get to this in a bit
});

});

Answer

You have not referenced the js file for ui-router,

<head>
    <title></title>
    <script src="js/angularmin.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.18/angular-ui-router.js" > </script>
    <script src="js/custom.js"></script>
</head>

DEMO APP

Comments