我可以在指令中注入服务吗？

我正在尝试在如下的指令中注入服务：

 var app = angular.module('app',[]);
 app.factory('myData', function(){
     return {
        name : "myName"
     }
 });
 app.directive('changeIt',function($compile, myData){
    return {
            restrict: 'C',
            link: function (scope, element, attrs) {
                scope.name = myData.name;
            }
        }
 });

但是，这返回给我一个错误Unknown provider: myDataProvider 。 有人可以看看代码并告诉我，如果我做错了什么？

---

您可以在Directive上进行注入，而且看起来就像在其他地方一样。

app.directive('changeIt', ['myData', function(myData){
    return {
        restrict: 'C',
        link: function (scope, element, attrs) {
            scope.name = myData.name;
        }
    }
 }]);

---

将您的指令定义从app.module更改为app.directive 。 除此之外，一切看起来都很好。 顺便说一句，你很少必须注入一项服务到指令。 如果您要将一项服务（通常是数据源或模型）注入您的指令（这是某种视图的一部分），那么您正在创建视图和模型之间的直接耦合。 您需要使用控制器将它们连接在一起。

它确实工作正常。 我不确定你在做什么是错的。 这是它的一大块工作。

http://plnkr.co/edit/M8omDEjvPvBtrBHM84Am

---

您也可以使用$ inject服务来获得您喜欢的任何服务。 如果我不提前知道服务名称，但知道服务接口，我觉得这很有用。 例如，一个将表格插入ngResource端点的指令或一个与任何api端点交互的通用删除记录按钮。 您不想为每个控制器或数据源重新实施table指令。

template.html

<div my-directive api-service='ServiceName'></div>

my-directive.directive.coffee

angular.module 'my.module'
  .factory 'myDirective', ($injector) ->
    directive = 
      restrict: 'A'
      link: (scope, element, attributes) ->
        scope.apiService = $injector.get(attributes.apiService)

现在您的“匿名”服务已经完全可用。 例如，如果它是ngResource，则可以使用标准ngResource接口来获取数据

例如：

scope.apiService.query((response) ->
  scope.data = response
, (errorResponse) ->
  console.log "ERROR fetching data for service: #{attributes.apiService}"
  console.log errorResponse.data
)

我发现这种技术在制作与API端点交互的元素时非常有用。

链接地址: http://www.djcxy.com/p/77691.html

上一篇: Can I inject a service into a directive?

下一篇: Dependency injection in services, factories, filters etc