这是我的Index.html代码
<!DOCTYPE html>
<html ng-app="demo">
<head>
<title></title>
<script src="scripts/angular.min.js"></script>
<script src="scripts/angular-route.min.js"></script>
<script src="scripts/CustomAngularJavaScript.js"></script>
<link href="StyleSheet1.css" rel="stylesheet" />
<base href="/">
</head>
<body>
<table>
<tr><td colspan="2" class="header">
<h1>Web Portal</h1>
</td></tr>
<tr><td class="leftmenu">
<a href="Home">Home</a>
<a href="Courses">Courses</a>
<a href="Students">Student</a>
</td>
<td class="mainContent"><ng-view></ng-view></td>
</tr>
<tr>
<td colspan="2" class="footer"><b>Copyright</b></td>
</tr>
</table>
</body>
</html>
第二个js代码
/// <reference path="angular.min.js" />
var angualarModule = angular.module("demo", ["ngRoute"]);
angualarModule.config(["$routeProvider","$locationprovider",function ($routeProvider,$locationprovider) {
$routeProvider.
when('/Home', {
templateUrl: 'Templates/Home.html',
controller: 'HomeController'
}).
when('/Courses', {
templateUrl: 'Templates/Courses.html',
controller: 'CourseController'
}).
when('/Students', {
templateUrl: 'Templates/Students.html',
controller: 'StudentsController'
})
$locationprovider.html5mode(true);
}])
angualarModule.controller("HomeController", function ($scope) {
$scope.message = "Home Page" ;
})
angualarModule.controller("CourseController", function ($scope) {
$scope.courses = ["C Sharp","Angular","MVC"] ;
})
angualarModule.controller("StudentsController", function ($scope) {
$http.post('Service.asmx/getUser').then(function (res) {
$scope.students = res.data;
});
})
抛出错误"angular.min.js:6Uncaught error: [$injector:modulerr] http://errors.angularjs.org/1.5.8/$injector/modulerr?p0=demo&p1=Error%3A%20...0g%20(http%3A%2F%2Flocalhost%3A61022%2Fscripts%2Fangular.min.js%3A39%3A319)"
谁能告诉我我做错了什么,只有当我在angular模块因为它是$locationProvider
(带大写):)
为了最小化,你需要像这样注入你的提供者
angualarModule.controller("HomeController", ['$scope',function ($scope) {
$scope.message = "Home Page" ;
}]);
试试$locationProvider
。看来是拼写问题
你拼错了,应该是$locationProvider
var angualarModule = angular.module("demo", ["ngRoute"]);
angualarModule.config(["$routeProvider","$locationProvider",function ($routeProvider,$locationProvider) {
$routeProvider.
when('/Home', {
templateUrl: 'Templates/Home.html',
controller: 'HomeController'
}).
when('/Courses', {
templateUrl: 'Templates/Courses.html',
controller: 'CourseController'
}).
when('/Students', {
templateUrl: 'Templates/Students.html',
controller: 'StudentsController'
})
$locationProvider.html5mode(true);
}])
angualarModule.controller("HomeController", function ($scope) {
$scope.message = "Home Page" ;
})
angualarModule.controller("CourseController", function ($scope) {
$scope.courses = ["C Sharp","Angular","MVC"] ;
})
angualarModule.controller("StudentsController", function ($scope) {
$http.post('Service.asmx/getUser').then(function (res) {
$scope.students = res.data;
});
})
我采取了以下步骤来解决这个问题,
1. js文件引用顺序改变,
2. 变量