ng ui router

ng ui router

https://github.com/angular-ui/ui-router

ng-viewはmultiviewに対応していないので、ui routerを使用する。

使用例

• jsからのステート遷移

$state.transitionTo('state')
$state.go('state', {params: 'data'})

• controller間の値参照

resolve: {
  contacts: ['contacts',
    function( contacts){
      return contacts.all();
    }]
}

• parent & child https://github.com/angular-ui/ui-router/wiki/Nested-States-%26-Nested-Views

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

angular.module('myApp', ['ui.router', 'ui.router.stateHelper'])
  .config(function(stateHelperProvider){
    stateHelperProvider.setNestedState({
      name: 'root',
      templateUrl: 'root.html',
      children: [
        {
          name: 'contacts',
          templateUrl: 'contacts.html',
          children: [
            {
              name: 'list',
              templateUrl: 'contacts.list.html'
            }
          ]
        },
        {
          name: 'products',
          templateUrl: 'products.html',
          children: [
            {
              name: 'list',
              templateUrl: 'products.list.html'
            }
          ]
        }
      ]
    });
  });