如何調用以字符串形式存儲的匿名函數

Question

我試圖在AngularJs中動態設置頁面標題。 我正在使用angular-ui路由器和stateHelper。

所以我的主模板中有這個：

<title ng-bind="pageTitle"></title>

這在我的ui路由器中：

{
    name: 'show',
    url: '/:id',
    title: function($stateParams){
       return 'Showing '+$stateParams.id;
    }
}

然后這樣：

$rootScope.$on('$stateChangeStart', function(event, toState, toParams)
{
     //set page title
     if(angular.isFunction(toState.title))
     {
         var callBack = toState.title; //this is the anonymous function
         //I expect the anonymous function to return the title
         $rootScope.pageTitle = callBack;
     }else{
         $rootScope.pageTitle = toState.title;
     }
}

挑戰： var callBack = toState.title;

返回這樣的字符串：“ function（$ stateParams）{return'Showing'+ $ stateParams.id;}”

如何執行此功能，並同時遵守隨其傳遞的參數dependency injected參數（未知數量的DI）

注意：我非常害怕eval並且不想使用它:(

Answer 1

可以使用$injector.invoke調用具有相關依賴性的函數：

$rootScope.$on('$stateChangeStart', function(event, toState, toParams)
{
     if(angular.isFunction(toState.title) || angular.isArray(toState.title))
     {
         $rootScope.pageTitle = $injector.invoke(toState.title);
     }else{
         $rootScope.pageTitle = toState.title;
     }
}

與其他任何啟用DI的函數一樣， title應相應地加上注釋，它可以是函數或數組 。

Answer 2

您可以先將$ stateParams注入控制器（其中的$ rootScope。$ on語句所在的位置），然后調用

toState.title（$ stateParams）;

順便說一句，您可以考慮使用更好的解決方案來處理“動態標題”。 檢查此項目的使用方式： https : //github.com/ngbp/ngbp