0

UI-router の構成設定を理解しており、正常に動作しています。現在、次の構成をディレクティブに移動しようとしています。そのため、コードの長さは js ファイルで短縮されます。たぶん、それは貧弱なデザインですが、私はこれを達成したい:)

現在の構成 (UI ルーターの設計による)

//Router Configuration
angular.module('myApp', ['ui.router']).config(function($stateProvider) {
  $stateProvider.state('addCustomer', {
    url: "/addCustomer",
    templateUrl: 'views/customer/add_customer.html',
    controller: 'addCustomerController'
  });

  ...No of configuration, list is very big...
});  

//In Template
<a ui-sref="addCustomer">Add Customer</a>

私が変えようとしていること

//Router Configuration
angular.module('myApp', ['ui.router']).config(function($stateProvider) {

});  

//In Template
<a ui-sref="addCustomer" router-info="{'url':'/addCustomer', 'templateUrl':'views/customer/add_customer.html', 'controller':'addCustomerController'}">Add Customer</a>

//Directive- Dynamic routing
angular.module('myApp').directive('routerInfo', function(){
    var directive = {};
    directive.restrict = 'A';

    directive.compile = function(element, attributes) {

        var linkFunction = function($scope, element, attributes) {
            //Here I understand, I can not inject stateprovider. So kindly suggest any other way to do this
            //$stateProvider.state(attributes.uiSref, attributes.routerInfo);
        }

        return linkFunction;
    }

    return directive;
});

ディレクティブから UI ルーター構成を追加する方法は? 設定できる API はありますか? またはこれを処理する他のより良い方法...私の意図は、構成ブロックのコードを減らすことです。

4

1 に答える 1

1

1 つの巨大な構成ブロックを避けたい場合は、単純に複数の構成ブロックを使用して、それぞれを独自のファイルに入れます。構成コードを構成ブロックに入れない理由はありません。より良い方法でアプローチする必要があるように思われるため、小さなブロックに分割してください。

例:

// config/routes/user.routes.js

angular.module('yourModule')
.config([
  '$stateProvider',
  function($stateProvider) {

    $stateProvider
    .state('user', {
      url: '/users/:userName',
      abstract: true,
      // etc
    })
    .state('user.main', {
      url: '',
      //etc
    })
    .state('user.stuff', {
      url: '/stuff',
      // etc
    })
    ;

  }
])
;

ルートのセットごとに繰り返します。

// config/routes/more.routes.js

angular.module('yourModule')
.config([
  '$stateProvider',
  function($stateProvider) {

    $stateProvider
    .state('more', {
      url: '/more-routes',
      //etc
    })
    ;

  }
])
;
于 2014-11-12T07:42:35.637 に答える