Angular js是由google创建的一种js框架，使用它可以扩展应用程序中的html词汇，从而在web应用程序中使用html声明动态内容。
了解创建一个页面所需的资源，创建出我们想要的页面后，通过配置路由，可以正确的了解如何正确的展示一个页面，以及从一个页面跳到另一个页面。
配置路由的步骤如下：
1.引入所需的ng-route包：
ng-route包为页面的跳转提供环境，我们需要在main.html中用<script>标签引入。讲完下面的步骤后会用代码展示出来。
2.引入文件之间的依赖关系：
<html lang="en" ng-app="orderMasterApp">
3.配置路由：
a.首先来了解一下页面地址和控制器之间的关系：
.when('/order.html',Handler)//页面地址和控制器
然后可以写成：
.when(/'order.html',{templateURL:'页面模板'，controller:'控制器'})
然后配置order.html的控制器：
.when('order',{templateURL: 'order,html'
controller: '控制器的名字'})
下面来构造一个控制器，并设置它的名字，如设置order.html的控制器名字为：OrderCtrl，代码如下：
angular.module('orderMasterApp')
.controller('OrderCtrl',function($scope,$location){
这里面是控制器控制的内容
})
在实际写的过程中，我们会这样写：
anjular .module('orderMasterApp', [ngRoute])
.config(function ($routeProvider) {
$routeProvider//路径的提供者
.when('/', {
templateUrl: 'html/order.html',//模板
controller: 'OrderCtrl'//控制器
})
路由是由$routeProvide来声明，是$route服务的提供者。
下面拿我写的代码展示一下：
html页面：
<div class="header">订餐</div>
<div class="order">
<button class="help_order" ng-click="go_to_order()">帮订餐</button>
<button class="buttons" ng-click="go_to_menu()">看订单</button>
</div>
控制器js页面：
var app = anjular .module('orderMasterApp', [ngRoute])
app.controller('OrderCtrl',function($scope,$location){
$scope.go_to_order=function(){
$location.path('select_menu')
}
})
route页面：
app.config(function ($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'html/order.html',
controller: 'OrderCtrl'
})
})
main，html页面：
<html lang="en" ng-app="orderMasterApp">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="download/angular.min.js "></script>
<script src="download/angular-route.min.js "></script>
<script src="js/route.js"></script>
<script src="js/order_controller.js "></script>
</head>
<body>
<div ng-view></div>
</body>
</html>
通过main.html页面上面order.html和js里面的代码展示在页面上，在main.html页面把需要引入的提供环境的文件都引入，点击按钮上的帮订餐按钮后就会执行控制js页面里面的go_to_order的函数，这里没有展示下个页面，只是将第一个页面展示出来了，如果写更多的页面的话都是用这个方法来配置路由实现跳转的。