主页面:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>日考</title>
<script src="js/angular.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/angular-route.js" type="text/javascript" charset="utf-8"></script>
<style type="text/css">
.left {
width: 50%;
height: 40px;
float: left;
text-align: center;
}
.right {
width: 50%;
height: 40px;
float: left;
text-align: center;
}
a {
text-decoration: none;
}
</style>
</head>
<body ng-app="myApp">
<div class="left">
我的站点
</div>
<div class="right">
<a href="#/zhuye">主页</a>
<a href="#/women4">关于我们</a>
<a href="#/lianxi">联系我们</a>
</div>
<div ng-view></div>
<script type="text/javascript">
var mo = angular.module("myApp", ["ngRoute"]);
mo.config(function($routeProvider) {
$routeProvider.when("/zhuye", {
templateUrl: "zhuye.html"
});
$routeProvider.when("/lianxi", {
templateUrl: "lianxi.html"
});
$routeProvider.when("/women4", {
templateUrl: "women4.html"
});
});
</script>
</body>
</html>
跳转页面:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>练习我们</title>
</head>
<body>
<div class="head">
<h2>这里显示信息</h2>
hello,this is my<br />
good file.<br />
<textarea>
</textarea><br />
<button>发送信息</button>
</div>
</body>
</html>