angularjs中ngRoute與ui-router的對比

   使用ngRoute配置app.js，在頁面跳轉方面沒有ui-router方便，在ui-router中我們可以使用 $scope.$state.go('persons');進行頁面跳轉。‘persons’是state的第一個參數。state的第一個參數並不是匹配規則，而是叫狀態名，也就是說這個參數事實上可以是任意的，它用來給當前狀態增加一個名字，觸發路由規則還是看url的內容。

   下面給出用ngRoute寫的app.js代碼

    

'use strict';
/* App Module */

var personApp = angular.module('personApp', [ 'ngRoute',
		'personControllers',
		'personServices']);

personApp.config([ '$routeProvider', function($routeProvider) {
	$routeProvider.when('/persons', {
		templateUrl : 'home.html',
		controller : 'personListCtrl'
		
	}).when('/addPerson', {
		templateUrl : 'addPerson.html',
		controller : 'addPersonCtrl'
		
	}).when('/editPerson/:personId', {
		templateUrl : 'editPerson.html',
		controller : 'editPersonCtrl'
	}).when('/deletePerson/:personId', {
		redirectTo : '/persons',
		templateUrl : 'home.html',
		
		controller : 'deletePersonCtrl'
			
	}).when('/persons/:personId', {
		templateUrl : 'personInfo.html',
		controller : 'personInfoCtrl'
	}).otherwise({
		redirectTo : '/persons'
			
	});
} ]);

使用ui-router寫的app.js

'use strict';
/* App Module */

var personApp = angular.module('personApp', [ 'ui.router',
		'personControllers',
		'personServices']);
personApp.run(function($rootScope, $state, $stateParams) {
    $rootScope.$state = $state;
    $rootScope.$stateParams = $stateParams;
});

personApp.config(function($stateProvider, $urlRouterProvider) {
	    $urlRouterProvider.otherwise('/persons');
	    $stateProvider.state('persons',{
	            url        : '/persons',
	            templateUrl : 'home.html',
	            controller : 'personListCtrl'
	        }).state('addPerson',{
	            url        : '/addPerson',
	            templateUrl : 'addPerson.html',
	            controller : 'addPersonCtrl'
	        }).state('editPerson',{
	            url        : '/editPerson/:personId',
	            templateUrl : 'editPerson.html',
	            controller : 'editPersonCtrl'
	        }).state('deletePerson',{
	            url        : '/deletePerson/:personId',
	            templateUrl : 'index.html',
	            controller : 'deletePersonCtrl'
	        }).state('personInfo',{
	            url        : '/persons/:personId',
	            templateUrl : 'personInfo.html',
	            controller : 'personInfoCtrl'
	        });
	    });

在controller中可以就可以通過$scope.$state.go（‘需要跳轉的狀態名’）實現頁面跳轉