这里似乎有什么问题我没有得到任何错误,但同时在路由方面没有进展。 。
的index.html
<!DOCTYPE html>
<html>
<head>
<title>My Angular App</title>
<link rel="stylesheet" type="text/css" href="/myAngularApp/css/style.css">
<link rel="stylesheet" type="text/css" href="/myAngularApp/css/bootstrap/css/bootstrap.min.css">
<script type="text/javascript" src="/myAngularApp/css/angular/angular.min.js"></script>
<script src="/myAngularApp/css/mainpage.js"></script>
<script type="text/javascript" src="/myAngularApp/css/angular/angular-animate.min.js"></script>
<script type="text/javascript" src="/myAngularApp/css/angular/angular-resource.min.js"></script>
<script type="text/javascript" src="/myAngularApp/css/angular/angular-route.min.js"></script>
<script type="text/javascript" src="/myAngularApp/css/bootstrap/ui-bootstrap-tpls-2.2.0.min.js"></script>
</head>
<body ng-app="myApp">
<h1> this is index.html </h1>
<div ng-view></div>
</body>
</html>
mainpage.js //我的控制器在哪里
var app = angular.module('myApp', ['ngRoute', 'ngAnimate', 'ngResource', 'ui.bootstrap']);
app.config(function($routeProvider) {
$routeProvider
.when('/', {
templateUrl : 'index.html'
})
.when('/home', {
templateUrl : 'homepage.html'
})
.otherwise({
templateUrl : 'index.html'
});
});
当我在浏览器中加载'/'时,/ home发生的情况与/ home相同我不知道在哪里出错,因为我的控制台没有错误
答案 0 :(得分:0)
我认为问题在于你的javascript文件名。在索引中,您提到了mainpage.js,并在描述中提到了homepage.js。
编辑:好的。然后尝试安排文件列表,如
<script type="text/javascript" src="/myAngularApp/css/angular/angular.min.js"></script>
<script type="text/javascript" src="/myAngularApp/css/angular/angular-animate.min.js"></script>
<script type="text/javascript" src="/myAngularApp/css/angular/angular-resource.min.js"></script>
<script type="text/javascript" src="/myAngularApp/css/angular/angular-route.min.js"></script>
<script type="text/javascript" src="/myAngularApp/css/bootstrap/ui-bootstrap-tpls-2.2.0.min.js"></script>
<script src="/myAngularApp/css/mainpage.js"></script>
答案 1 :(得分:0)
正如用户Priyanka的回答中提到的,文件名可能是个问题。但这应该会在控制台上产生错误,并且根据您的说法,控制台上没有错误。
另一个可能的原因可能是您导入文件的顺序。我通常以这种方式对文件进行排序 -
<head>
<!-- 1. External CSS Libraries likes bootstrap, jquery -->
<!-- 2. My Application specific CSS files -->
<!-- 3. External JS libraries like Angular, bootstrap, JQuery -->
<!-- 4. My Application specific JS files like my controllers, services, directives etc.
</head>
&#13;
同样,导入外部JS库的顺序也可能导致问题。