ダイナミックテンプレートのURL

Question

私は最初に既存のアプリでAngular 1に頭を浮かせています。私が変更したいこのアプリケーションに関するものの1つは、アプリケーション内のすべてのエンティティに対して個別のサービスやその他のものがどのようにあるかです。

すべてのエンティティに対して1つのサービスしかないように抽象化しましたが、ファイル名が特定の状態パラメータと等しいテンプレートを読み込もうとしています。

はここごとのエンティティのルーティングが現在行われている方法は次のとおりです。私はURLで{entityTypeName}を導入する方法

namespace App.Entity { 
    'use strict'; 

    angular 
     .module('app.entity') 
     .run(appRun); 

    appRun.$inject = ['routerHelper']; 

    function appRun(routerHelper: Common.Router.IRouterHelperService) { 
     routerHelper.configureStates(getStates()); 
    } 

    function getStates() { 
     return [{ 
      name: '||entityTypeName||', 
      url: '/{entityTypeName}/{entityId}', 
      templateUrl: 'app/entity/||entityTypeName||.html', 
      controller: 'entityCtrl', 
      controllerAs: 'vm', 
      data: { 
       title: '||entityTypeName||' 
      } 
     }]; 
    } 
} 

お知らせ：

namespace App.Employee { 
    'use strict'; 

    angular 
     .module('app.employee') 
     .run(appRun); 

    appRun.$inject = ['routerHelper']; 
    function appRun(routerHelper: Common.Router.IRouterHelperService) { 
     routerHelper.configureStates(getStates()); 
    } 

    function getStates() { 
     return [{ 
      name: 'employee', 
      url: '/employee/{employeeId}', 
      templateUrl: 'app/employee/employee.html', 
      controller: 'employeeCtrl', 
      controllerAs: 'vm', 
      data: { 
       title: 'Employee' 
      } 
     }]; 
    } 
} 

は、ここで私はそれを変更したいものです。これにより、適切なWeb APIサービスが正しく指し示され、エンティティが取り戻されます。しかし、{entityTypeName}と一致するものが||entityTypeName||のプレースホルダーにトークン化されます。それは少なくとも一般的な考えです。

私はこの時点でAngularがほとんど分かりませんが、私が行っているように学習していますので、追加のコードが必要かどうか教えてください。

Answer 1

templateUrlプロパティに文字列ではなく関数を指定すると、現在の状態パラメータが渡されます。同様に：

params引数は、ui-routerフレームワークによって提供されます。

Answer 2

私もそうのようなビューとビューパラメータを動的ルーティングを使用して似たような操作を行います。

 /** 
     * url: "/view?a" 
     * Will match to url of "/view?a=value" 
     */ 
     .state('root.view', { 
      url: '/view?a', 
      views: { 
        'main-content@': { templateUrl: function(params) {console.log(params.a); return 'app/views/ + params.path + ".php"} } 
      } 
     }) 

または、次のために： の

 /** 
     * Dynamic Routing 
     */ 
     .state('root.catpath', { 
      url: '/{path:.*}', 
      views: { 
       'main-content@': { templateUrl: function(params) {console.log(params); return 'app/views/' + params.path + ".php"} } 
      } 
     });