angular js路由

（1）作用

              实现页面之间的跳转，通常用在单页面应用中（即只有一个主页面，其他页面通过ng-view引入进来）

（2）使用

              1.引入依赖angular-route.js

  <script src="bower_components/angular-route/angular-route.js"></script>

              2.在主模块中注入ngRoute             

var phonecatApp = angular.module('phonecatApp', [
  'ngRoute'
]);

              3.使用config方法定义路由，并注入$routeProvider

phonecatApp.config(
  function($routeProvider) {
    $routeProvider.
      when('/phones', {
        templateUrl: 'partials/phone-list.html',
        controller: 'PhoneListCtrl'
      }).
      when('/phones/:phoneId', {
        templateUrl: 'partials/phone-detail.html',
        controller: 'PhoneDetailCtrl'
      }).
      otherwise({
        redirectTo: '/phones'
      });
  });

             when方法中有2个参数

• templateUrl: 表示路由跳转的view模板

• controller: 控制器

             一般main route使用"/"来表示
            otherwise定义了我们找不到路由时跳转的地方

              4.使用<ng-view>定义需要跳转的地方

<div class="header">My page</div>
<div ng-view></div>
<span class="footer">A footer</span>

               在执行了跳转之后，My page，A footer是不会改变的，改变的只是中间部分

              5.跳转页面的确定

                 我们的详情页面的url是“/phones/:phoneId”，里面的:phoneId表示占位符，所以只要url是/phones/这种类型就会匹配。

                 详情是根据点击的phoneId确定的，那么这个phoneId是从哪里获得的呢？

                 实际上可以传递$routeParams来确定，如下

phonecatControllers.controller('PhoneDetailCtrl', ['$scope', '$routeParams', 
  function($scope, $routeParams) {
    $scope.id = $routeParams.phoneId

  }]);