我已经尝试了许多不同的方法让我的Angular路由工作,但是,我无法获得正确路由的链接。任何帮助将不胜感激。
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>SIE Special Projects</title>
<link href="Content/bootstrap.min.css" rel="stylesheet" />
<script src="Scripts/angular.js"></script>
<script src="Scripts/angular-route.js"></script>
<script src="Scripts/angular-resource.js"></script>
<script src="script.js"></script>
</head>
<body ng-app="sp_app">
<div ng-controller="mainController">
<nav class="navbar navbar-default">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand" href="/">{{ message }}</a>
</div>
<ul class="nav navbar-nav navbar-right">
<li><a href="#"><i class="fa fa-home"></i> Home</a></li>
<li><a href="#projects"><i class="fa fa-shield"></i> Projects</a></li>
</ul>
</div>
</nav>
<div id="main">
<div ng-view></div>
</div>
</div>
</body>
</html>
这是我的路由代码的一部分 http://embed.plnkr.co/FVVdbuKddGNFQgjkuSxv/
路由代码:
var app = angular.module('sp_app', ['ngRoute']);
// configure our routes
app.config(function ($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'home.html',
controller: 'mainController'
})
.when('/projects', {
templateUrl: 'allprojects.html',
controller: 'projectsController'
});
});
app.controller('mainController', function ($scope) {
$scope.message = 'Welcome to the Special Projects web page';
});
app.controller('projectsController', function ($scope) {
$scope.message = 'Here are the projects';
});