代码案例:
1 <html> 2 <head> 3 <meta charset="utf-8"> 4 <title>AngularJS 路由实例</title> 5 </head> 6 <body ng-app='routingDemoApp'> 7 8 <h2>AngularJS 路由应用</h2> 9 <ul> 10 <li><a href="#/">首页</a></li> 11 <li><a href="#/computers">分页1</a></li> 12 <li><a href="#/printers">分页2</a></li> 13 <li><a href="#/blabla">其他</a></li> 14 </ul> 15 16 <div ng-view></div> 17 <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script> 18 <script src="http://apps.bdimg.com/libs/angular-route/1.3.13/angular-route.js"></script> //注意:要引入Angular-route.js 19 <script> 20 angular.module('routingDemoApp',['ngRoute']) //注意:依赖注入 ngRoute 模块 21 .config(['$routeProvider', function($routeProvider){ 22 $routeProvider 23 .when('/',{template:'这是首页'}) 24 .when('/computers',{template:'这是分页1的页面'}) 25 .when('/printers',{template:'这是分页2页面'}) 26 .otherwise({redirectTo:'/'}); //找不到路径时跳转的页面 27 }]); 28 </script> 29 30 31 </body> 32 </html>