javascript - Add additional information to route - workaround for TypeScript? -

normally put settings route. example:

              .when('products', {                 templateurl: 'app/products.html',                 settings: {                     showbuy: true,                     showexport: true,                     description: "product list"                 },[...] 

since started typescript , angularjs interface of irouteprovider brings limitations regarding irouteprovder btw. iroute interface. iroute interface doesn't provide properties store custom settings object.

at moment can set predefined properties of iroute interface like:

app.config([             <any>'$routeprovider', function routes($routeprovider: ng.route.irouteprovider) { $routeprovider                     .when('/product',                     {                          templateurl: 'app/products.html',                          controller:'somecontroller'                          [...]                     }) 

the angular js ng-route interface defined as:

interface irouteprovider extends iserviceprovider {          otherwise(params: iroute): irouteprovider;     when(path: string, route: iroute): irouteprovider; } /**  * see http://docs.angularjs.org/api/ngroute/provider/$routeprovider#when    api documentation  */ interface iroute {     /**      * {(string|function()=}      * controller fn should associated newly created scope or name of registered controller if passed string.      */     controller?: string|function;     /**      * controller alias name. if present controller published scope under controlleras name.      */     controlleras?: string;     /**      * undocumented?      */     name?: string;     [...] 

so asked self, if there exists workaround save custom object each defined route.

one approach define new interface extends ng.route.iroute. when route declared, cast route definition new interface.

define new interface:

export interface ipagetitleroute extends ng.route.iroute {     pagetitle: string; } 

define route casting new interface:

angular.module('app').config(['$routeprovider',     function routes($routeprovider: ng.route.irouteprovider) {         $routeprovider             .when('/', <ipagetitleroute> {                 controller: app.controllers.homecontroller,                 controlleras: 'vm',                 templateurl: './views/app/home.html',                 pagetitle: 'home'             })             .otherwise('/');     } ]); 

leverage new property in appropriate places (like $routechangesuccess):

angular.module('app').run(['$rootscope', '$location',     function($rootscope: ng.irootscopeservice, $location: ng.ilocationservice) {         $rootscope.$on('$routechangesuccess',             function(event: ng.iangularevent, current: ipagetitleroute, previous: ng.route.iroute) {                 $rootscope['pagetitle'] = current.pagetitle;             }         );     } ]); 

i found this answer related question regarding casting interface useful. here quote:

an interface in typescript compile-time construct, no run-time representation. might find section 7 of typescript specification interesting read has complete details.