1
2
3
4
5

$stateProvider
    .state('contacts', {
        url: "/contacts",
        templateUrl: 'contacts.html'
    })

1
2
3
4
5
6
7
8
9
10

$stateProvider
    .state('contacts.detail', {
        // 這裡設定了url引數
        url: "/contacts/:contactId",
        templateUrl: 'contacts.detail.html',
        controller: function ($stateParams) {
            // If we got here from a url of /contacts/42
            expect($stateParams).toBe({contactId: 42});
        }
    })

1
2

// 與前面的設定方法等效
url: "/contacts/{contactId}"

1
2

// 只會匹配 contactId 為1到8位的數字
url: "/contacts/{contactId:[0-9]{1,8}}"

1
2

url: "/contacts?myParam"
// 匹配 "/contacts?myParam=value"

1
2

url: "/contacts?myParam1&myParam2"
// 匹配 "/contacts?myParam1=value1&myParam2=wowcool"

1
2
3
4
5
6
7
8
9

$stateProvider
  .state('contacts', {
     url: '/contacts',
     ...
  })
  .state('contacts.list', {
     url: '/list',
     ...
  });

1
2
3
4
5
6
7
8
9

$stateProvider
  .state('contacts', {
     url: '/contacts',
     ...
  })
  .state('contacts.list', {
     url: '^/list',
     ...
  });

1
2
3
4
5
6
7
8
9
10
11
12
13
14

// 如果狀態中 url 屬性是：
url: '/users/:id/details/{type}/{repeat:[0-9]+}?from&to'

// 當瀏覽
'/users/123/details//0'

// $stateParams 物件將是
{ id:'123', type:'', repeat:'0' }

// 當瀏覽
'/users/123/details/default/0?from=there&to=here'

// $stateParams 物件將是
{ id:'123', type:'default', repeat:'0', from:'there', to:'here' }

1
2
3
4
5
6
7
8
9
10

$stateProvider.state('contacts.detail', {  
   resolve: { 
      someResolve: function($state){ 
         //*** 不能在這裡使用 $stateParams , the service is not ready ***//
         //*** 使用 $state.current.params 來代替 ***//
         return $state.current.params.contactId + "!" 
      }; 
   },
   // ...
})

1
2
3
4
5
6
7
8
9
10
11
12

$stateProvider.state('contacts.detail', {
   url: '/contacts/:contactId',   
   controller: function($stateParams){
      $stateParams.contactId  //*** Exists! ***//
   }
}).state('contacts.detail.subitem', {
   url: '/item/:itemId', 
   controller: function($stateParams){
      $stateParams.contactId //*** 注意! DOESN'T EXIST!! ***//
      $stateParams.itemId //*** Exists! ***//  
   }
})

1
2
3
4
5
6
7

app.config(function($urlRouterProvider){
    // when there is an empty route, redirect to /index   
    $urlRouterProvider.when('', '/index');

    // You can also use regex for the match parameter
    $urlRouterProvider.when('/aspx/i', '/index');
})

1
2
3
4
5

$urlRouterProvider.when(state.url, ['$match', '$stateParams', function ($match, $stateParams) {
    if ($state.$current.navigable != state || !equalForKeys($match, $stateParams)) {
        $state.transitionTo(state, $match, false);
    }
}]);

1
2
3
4
5
6
7
8
9
10

app.config(function($urlRouterProvider){
    // 在配置（狀態配置和when()方法）中沒有找到url的任何匹配
    // otherwise will take care of routing the user to the specified url
    $urlRouterProvider.otherwise('/index');

    // Example of using function rule as param
    $urlRouterProvider.otherwise(function($injector, $location){
        ... some advanced code...
    });
})

1
2
3
4
5
6
7

app.config(function($urlRouterProvider){
    // Here's an example of how you might allow case insensitive urls
    $urlRouterProvider.rule(function ($injector, $location) {
        var path = $location.path(), normalized = path.toLowerCase();
        if (path != normalized) return normalized;
    });
})

1
2
3
4

var urlMatcher = $urlMatcherFactory.compile("/home/:id?param1");
$stateProvider.state('myState', {
    url: urlMatcher 
});