Я впервые использую 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, который должен динамически меняться на angular в зависимости от верхних кнопок, но, хотяизменение 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"
});
})
Я не буду добавлять больше кода, если вы не думаете,это необходимо сделать простым.
Итак, нужна ли какая-то другая конфигурация?Прямо сейчас угловая часть не работает вообще (div кажется пустым, независимо от изменений в URL).
Я использую AngularJS 1.6.9.