Я пытаюсь создать сайт AngularJS "нажми и читай".У меня есть заголовок, который работает, который переводит пользователя между каталогом, страницей контактов и домашней страницей.Это отлично работает.У меня вопрос: как мне это кодировать, чтобы на главной странице пользователь мог нажать кнопку или ссылку, которая приведет его на страницу 2, затем со страницы 2 еще один щелчок приведет их на страницу 3 и т. Д.?Я также хотел бы, чтобы они могли двигаться в другом направлении.
Вот моя структура файлов / папок:
app/app.js
app/lib
content/css/styles.css
header.html
index.html
views/contactMe.html
views/directory.html
views/home.html
views/page1.html
app.js
angular.module('myApp', ['ngRoute'])
.config(['$routeProvider', function($routeProvider){
$routeProvider
.when('/home', {
templateUrl: 'views/home.html'
})
.when('/directory', {
templateUrl: 'views/directory.html',
//since this page requires a controller
controller: 'myController'
})
.when('/contactMe', {
templateUrl: 'views/contactMe.html',
//since this page requires a controller
controller: 'myController'
})
.otherwise({
redirectTo: '/home'
});
}]); //.config
angular.module('myApp')
.controller('myController', function($scope) {
$scope.message = ("Hello World");
}
});
header.html
<div id="menu-bar">
<h1>My Sample App</h1>
<ul>
<li><a href="#home">Home</a></li>
<li><a href="#directory">Directory</a></li>
<li><a href="#contactMe">Contact Me</a></li>
</ul>
</div>
index.html
<!DOCTYPE html>
<html lang="en" ng-app="myApp">
<head>
<title>Sample app</title>
<link href="content/css/styles.css" rel="stylesheet" type="text/css" />
<script src="app/lib/angular.min.js"></script>
<script src="app/lib/angular-route.min.js"></script>
<script src="app/app.js"></script>
</head>
<body>
<header ng-include="'header.html'"></header>
<main ng-view></main>
</body>
</html>