allen allen - 1 year ago 67
AngularJS Question

Need help checking over angular ui-router code

I'm trying to create a portfolio in angular, and can't seem to get the routing correct. I double checked with an app I had made previously, and can't seem to find anything. When I compile, there are no errors logged in the console. Could someone check if my code is properly laid out?

the HTML

<!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8">
<title>my portfolio</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="stylesheet.css">

<!-- <link href="' rel='stylesheet' type='text/css"> -->

<body np-app="myPort">
<div id="navigation-bar">
<li><a href="#/home">Home</a></li>
<li><a href="#/projects">My Projects</a></li>
<li><a href="#/contact">Contact</a></li>

<div ui-view></div>

<!-- loading angular frameworks -->
<script src=""></script>
<script src="bower_components/angular-ui-router/release/angular-ui-router.js"></script>
<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/bootstrap/dist/js/bootstrap.js"></script>
<!-- app js stuff -->
<script src="app.js"></script>

the module

angular.module('myPort', ['ui.router'])

.config(['$stateProvider', '$urlRouterProvider', function($stateProvider, $urlRouterProvider) {
.state('home', {
url: '/home',
templateUrl: 'partials/bio/index.html',

.state('projects', {
url: '/projects',
templateUrl: 'partials/projects/index.html',

.state('contact', {
url: '/contact',
templateUrl: 'partials/contact/index.html',

//no controllers linked for troubleshooting

Answer Source

There is a spelling mistake while defining ng-app.

Change <body np-app="myPort>" to <body ng-app="myPort>"

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