Как внедрить услугу в зависимости от атрибута директивы в угловом?

Question

Я имею следующую директиву

directiveModule.directive('typeahead', function() { 
    return { 
     restrict: 'E', 
     transclude: true, 
     scope: 'isolate', 
     templateUrl: 'assets/partials/common/typeahead.html' , 
     controller: ["$scope","$element","$attrs","$transclude", "Event", 
     function ($scope,$element,$attrs,$transclude, Event){ 
      console.log(eval($attrs.service + ".query();")); 

      $scope.search = function(){ console.log("Searching for:" + $scope.selectedValue) }; 
      $scope.selectedValue = ""; 
      $scope.providedItems = []; 
     }],  
    }; 
}); 

С следующему шаблону:

<div> 
<input ng-change="search()" ng-model="selectedValue" ng-click="log()" autocomplete="off" type="text"/> 
<ul class=".typeahead"> 
    <li ng-repeat="item in providedItems">{{eval(item + "." + descriptor)}}</li> 
</ul> 

и следующий вызов внутри мой взгляд:

Я хотел бы, чтобы услуги атрибут оценивается во время выполнения при вводе в контроллер в директиве. Так что там, где он теперь говорит

controller: ["$scope","$element","$attrs","$transclude", "Event", 
     function ($scope,$element,$attrs,$transclude, Event){ 

Было бы сказать, что-то подобное:

controller: ["$scope","$element","$attrs","$transclude", eval($attrs.service), 
     function ($scope,$element,$attrs,$transclude, eval($attrs.service)){ 

Однако я не могу получить доступ к $ AttrS от объема внутри вызова directiveModule.

Если есть какой-либо способ доступа к объявленной в представлении службе, которой было бы достаточно. Пожалуйста помоги!

Answer 1

Одним из решений для этого было бы создание и привязка контроллера самостоятельно. Все, что вам нужно, это ввести как $injector (для того, чтобы динамически разрешить службу), и $controller (чтобы динамически разрешить контроллер). И в вашей функции связывания вы сами создаете контроллер:

link: function(scope, elm, attr) { 
    $controller(function YourController($scope, dynamnicService) { 
     dynamicService.query(); 
    }, { 
     $scope: scope, 
     dynamicService: $injector.get($attr.service) 
    } 
) 
} 

Здесь важна одна важная вещь. В этом примере я рассматриваю, что ваша служба является строкой в ​​атрибуте элемента. Если это строка внутри области действия, отнесенная к атрибуту, вам нужно изменить подход. Вы должны указать $attr.observe атрибут, а при изменении вы должны воспользоваться услугой $injector.get(...) и передать ее контроллеру. Вы также создаете метод this.setService на самом контроллере, или $scope.setService, ваш вызов. Я бы предпочел контроллер, поскольку это связано с доступом к службе. Используя этот второй подход, вам не нужно создавать контроллер вручную, вы можете просто разоблачить этот метод и установить данные извне.

Еще одна информация, вы должны NEVER TOUCH THE DOM FROM YOUR CONTROLLER. Таким образом, передача $element, $attr и $transculde на контроллер, вероятно, плохая идея, несмотря ни на что.

Взгляните на документы о $controller, $injector и directive.