ルーティング（ui-router）
AngularJSではデフォルトのルーティング機能が微妙なので、サードパーティー製のui-routerを利用するのが一般的です。ui-routerではViewのネスト（入れ子）や、名前付けによる対象のView指定が可能で、デフォルトのルーティングよりも機能が豊富です。
構成
今回の構成は以下の通り。
/var/www/html/
├ index.html
├ views
│ ├ main.html
│ ├ search.html
│ └ article.html
├ scripts
│ ├ app.js
│ └ controller.js
└ lib
├ angular.min.js
└ angular-ui-router.min.js
ルーティングの例
トップHTML（index.html）
<!doctype html>
<html ng-app="myApp">
<head>
<meta charset="utf-8">
<base href="/" target="_self">
<title>ルーティングテスト</title>
</head>
<body>
<div ui-view></div>
<script src="lib/angular.min.js"></script>
<script src="lib/angular-ui-router.min.js"></script>
<script src="scripts/app.js"></script>
<script src="scripts/controller.js"></script>
</body>
</html>
メインHTML（main.html）
<header>ヘッダー</header>
<div ui-view></div>
<footer>フッター</footer>
検索HTML（search.html）
<button ng-click="openArticle(123)">記事の表示</button>
<a ui-sref="root.search(prev_page)">前のページへ</a>
<a ui-sref="root.search(next_page)">次のページへ</a>
HTML側でページ遷移させる場合、「href」にURLを直接指定する他に、上記の2,3行目のように「ui-sref」で定義する方法があります。()内には遷移に必要なパラメーターの情報（上記では「:param1」「:param2」「:page_no」の値）が必要なので、JavaScript側でデータを作成して設定します。
記事HTML（article.html）
<a href="/abc/def/?page_no=1">一覧へ戻る</a>
ルーティングの設定（scripts/app.js）
var myApp = angular.module('myApp', ['ui.router']);
myApp.config(function ($locationProvider, $stateProvider, $urlRouterProvider) {
// ルーティング
$stateProvider
.state('root', {url: '/', templateUrl: 'views/main.html', controller: 'MainCtrl'})
.state('root.search', {url: ':param1/:param2/?page_no', templateUrl: 'views/search.html', controller: 'SearchCtrl'})
.state('root.article', {url: 'article/:id/', templateUrl: 'views/article.html', controller: 'ArticleCtrl'});
// 上記で設定した以外のURLだった場合の遷移先
$urlRouterProvider.otherwise('/');
// HTML5モードの指定
$locationProvider.html5Mode(true);
});
URLパラメータは7行目の「:param1」「:param2」、8行目の「:id」のように定義します。
クエリストリングは7行目の「:page_no」のように定義。
コントローラーは7,8,9行目の「controller」で指定します。
コントローラーの設定（scripts/controller.js）
myApp.controller('MainCtrl', function ($scope) {
});
myApp.controller('SearchCtrl', function ($scope, $state, $stateParams) {
// 前ページへ遷移するためのパラメーターマップを作成
$scope.prev_page = {};
$scope.prev_page.param1 = $stateParams.param1;
$scope.prev_page.param2 = $stateParams.param2;
$scope.prev_page.page_no = $stateParams.page_no - 1;
// 次ページへ遷移するためのパラメーターマップを作成
$scope.next_page = {};
$scope.next_page.param1 = $stateParams.param1;
$scope.next_page.param2 = $stateParams.param2;
$scope.next_page.page_no = $stateParams.page_no + 1;
// 記事オープン
$scope.openArticle = function (article_id) {
var params = {};
params.id = article_id;
// ページ遷移
$state.go('root.article', params);
};
});
myApp.controller('ArticleCtrl', function ($scope, $stateParams) {
// URLパラメータの取得
alert($stateParams.id);
});
URLパラメータの取得（8,9,14,15行目）、クエリストリングの取得（10,16行目）、ともに「$stateParams」を利用して取得可能。
JavaScript側からページ遷移を行う場合は、16行目のように「$state.go」を利用します。
viewに名前を付けたやり方はこちら（入門 angular-ui-router - Qiita）を参照。