AngularJS - 手動使用注入器注入服務時出錯

Question

當我嘗試手動使用angular.injector注入一個打開對話框的服務時，遇到了一個問題，該對話框又在其模板中使用了一個指令，該指令使用動態模板。

我在控制檯中的錯誤是：

1：未知的提供：$ rootElementProvider < - $ rootElement的< - $位置< - $ anchorScroll < - ngIncludeDirective < - $位置

2 ：無法找到指令'ngInclude'所需的控制器'ngInclude'！

這裏是plunker demonstrating the problem

var customSvc = angular.injector(['ng', 'pluginApp']).get("customSvc"); 
customSvc.testOpenDialog(100, scope); 

我也嘗試建立鏈接，並指定其作爲指令屬性，並從templateUrl函數訪問它，而且在這種情況下，失敗，因爲值I接收只是變量的名稱，而不是內容。

如果我通過angular.injector避免注入服務，代碼有效，但由於應用程序的性質，我無法避免它，此外，我有興趣瞭解此錯誤的原因是什麼如果有人願意就此問題發表看法的話。

Answer 1

的解決方案是注入服務採用以下方式：

var customSvc = angular.injector(['ng', 'pluginApp', 
     function($provide) { 
     var $rootElement = angular.element(document.querySelector('body')); 
     $provide.value('$rootElement', $rootElement); 
     }]).get("customSvc"); 

這裏是工作plunker

Answer 2

在你，gedContextMenu.js文件，做如下更改

進樣pluginApp

angular.module('gedContextMenuApp', ['ui.bootstrap', 'mgcrea.ngStrap.popover','pluginApp']); 

進樣服務customSvc在gedContextMenu菜單指令，

angular.module('gedContextMenuApp').directive('gedContextMenu',['$log','$templateCache', '$uibModal', 'customSvc', function($log, $templateCache, $uibModal, customSvc) { 
    return { 
    restrict: 'AE', 
    scope: { 
     gedContextData: '=' 
    }, 
    template: "<button class='fa fa-cog' bs-popover data-template='{{popoverTemplate}}' data-auto-close='1' data-placement='bottom' data-animation='am-flip-x'></button>", 
    controller: function($scope) { 
     $scope.popoverTemplate = 'popoverTemplate.html'; 

     $scope.executePlugin = function($event, contextItem) { 
     var propName = contextItem.action; 
     $scope.contextItem = contextItem; 
     $log.info('property name ' + propName + ' used to trigger event ', $event.type); 
     $scope[propName] = $event; 
     } 

     $scope.click = function($event, contextItem) { 
     $scope.executePlugin($event, contextItem); 
     } 
    }, 
    link: function(scope, element, attrs) { 
     scope.$watch('openDialog', function(event) { 
     if (event && event.type === 'click') { 
      console.log(customSvc); 
      // var customSvc = angular.injector(['ng', 'pluginApp']).get("customSvc"); 

      //angular.injector(['ng', function($provide) { 
      // var $rootElement = angular.element(document.querySelector('body')); 
      // $provide.value('$rootElement', $rootElement); 
      //}]).invoke(function($injector) { 
      // var localRootElement = $injector.get('$rootElement'); 
      //}); 

      // customSvc.testOpenDialog(100, scope); 
      //customSvc.testDirettivaConfirm(100, scope); 

     } 
     }); 
    } 
    } 
}]);