angularjs：路由设置

mycrm项目登录后，进入index界面，设计成左边是一个菜单栏，右边作为一个详情页面，前端采用了angular后使用路由可以很好的解决这个问题；

图1-1

图1-2

具体设计看下面代码：

var aoorey= angular.module('aoorey', [ 'ngRoute','ui.bootstrap','aoorey.controller','aoorey.controller.base','aoorey.controller.blackList',
	'aoorey.controller.guide','aoorey.controller.user','aoorey.controller.order','aoorey.controller.coupons',
	'aoorey.controller.guideAccount','aoorey.controller.guidePunish','aoorey.controller.aooreyHome','aoorey.controller.carData',
	'aoorey.services','aoorey.services.final','aoorey.directives','xeditable' ])
.config([
	'$routeProvider','$httpProvider',
	function($routeProvider, $httpProvider) {
	    $routeProvider.when('', {
			templateUrl : 'test',
			controller : 'dashboard'
	    }).when('/dashboard', {
			templateUrl : 'test',
			controller : 'dashboard'
	    }).when('/menu', {
			templateUrl : 'menu/menu',
			controller : 'menuCtl'
	    }).when('/userRole', {
			templateUrl : 'userRole/role',
			controller : 'userRoleCtl'
	    }).otherwise({
   
			redirectTo : 'dashboard'
	    });

当登录后，springmvc跳转到index页面，index页面中使用了ng-view

		
		<div class="col-sm-9 col-sm-offset-3 col-lg-10 col-lg-offset-2 main" ng-view>			
			
			
		</div>	<!--/.main-->
		

刚登录后不发请求，默认的走路由的.otherwise，进入设置的dashboard页面然后走springmvc的页面跳转

@RequestMapping(value = "/dashboard")
	public String dashboard() {
		return "dashboard";
	}
	@RequestMapping(value = "/test")
	public String test() {
		return "test";
	}

图1-3

下面跟上文档

AngularJS 路由允许我们通过不同的 URL 访问不同的内容。

通过 AngularJS 可以实现多视图的单页Web应用（single page web application，SPA）。

通常我们的URL形式为 http://runoob.com/first/page，但在单页Web应用中 AngularJS 通过 # + 标记 实现，例如：

http://runoob.com/#/first
http://runoob.com/#/second
http