我是第一次实现Angular。我在Eclipse中使用工厂,控制器和模板(不知道是否还有其他方法)。因此,我将重定向到我的index.html页面:
<!DOCTYPE html>
<html id="list" data-ng-app="myApp">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="../css/stylesheet1.css" />
<title>App</title>
<!-- Include the AngularJS library -->
<script src="../js/angular/angular.js"></script>
<script src="../js/angular/angular-route.js"></script>
<!-- Modules -->
<script src="../js/app.js"></script>
<script src="../js/factories/objectFactory.js"></script>
<script src="../js/factories/usersFactory.js"></script>
<script src="../js/controllers/headerCtrl.js"></script>
<script src="../js/controllers/listCtrl.js"></script>
<script src="../js/controllers/objectHandlerCtrl.js"></script>
</head>
<body>
<div data-ng-controller="headerCtrl as headerVM">
<nav id="links">
<div class="inner"><button onclick="location.href ='#!/createObject'">Create</button></div>
<div class="inner"><button onclick="location.href ='#!/editUser'">Edit user</button></div>
<div class="inner"><button onclick="location.href ='#!/deleteUser'">Delete user</button></div>
<div class="inner"><button onclick="location.href ='../LogOutServlet'">Exit</button></div>
</nav>
</div>
<div data-ng-view></div>
</body>
</html>
在最后一行的第三行中,我有一个div,该角度应根据上部按钮的角度进行动态更改,但是,尽管当我按下按钮时url更改了,但该区域为空。
为了协调路线,我有app.js:
angular.module('myApp', ['ngRoute'])
.config(function($routeProvider){
$routeProvider
.when("/", {
controller: "listCtrl",
controllerAs: "listVM",
templateUrl: "listObjectTemplate.html",
resolve: {
delay: function($q, $timeout) {
var delay = $q.defer();
$timeout(delay.resolve, 500);
return delay.promise;
}
}
})
.when("/createObject", {
controller: "objectHandlerCtrl",
controllerAs: "objectHandlerVM",
templateUrl: "noteHandlerTemplate.html"
})
.when("/editObject/:ID", {
controller: "objectHandlerCtrl",
controllerAs: "objectHandlerVM",
templateUrl: "objectHandlerTemplate.html"
})
.when("/deleteNote/:ID", {
controller: "objectHandlerCtrl",
controllerAs: "objectHandlerVM",
templateUrl: "objectHandlerTemplate.html"
});
})
除非您认为有必要保持简单,否则我不会添加更多代码。
因此,是否需要其他配置?现在,角度部分根本不起作用(无论url中的变化如何,div似乎都是空的)。
我正在使用AngularJS 1.6.9。
最佳答案
尝试删除ng-controller data-ng-controller="headerCtrl as headerVM"
,这是不必要的,因为您是在路由配置上配置的
关于javascript - Angular 不显示HTML页面,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/50669189/