我可以将服务注入AngularJS中的指令吗？

我正在尝试将服务注入到指令中，如下所示：

 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;
            }
        }
 });

---

但这将返回一个错误

未知提供程序：myDataProvider

。有人能检查一下代码并告诉我我是否做错了什么吗？

将指令定义从

app.module

更改为

app.directive

。除此之外，一切看起来都很好。 顺便说一句，很少需要将服务注入到指令中。如果将服务（通常是数据源或模型）注入到指令（这是视图的一部分）中，则在视图和模型之间创建直接耦合。您需要使用控制器将它们连接在一起，从而将它们分开。

它确实很好用。我不确定你在做什么，这是错的。这是一个成功的例子

---

您可以在指令上执行注入，它看起来就像在其他任何地方一样

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

---

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

template.html

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

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

例如：

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

---

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

你能举个例子吗please@Exception你能把你的代码放在小提琴里吗？我可以看一看，看看你的代码为什么不工作，也许可以帮助你修复它。@Exception添加了一个工作的plunk，显示代码工作。我刚刚发现：如果你在函数参数中定义注入，

function（$location）{…

但不要在函数中实际引用

$location

，AngularJS不会执行注入。你唯一注意到这种行为的时候是在调试器中。我不确定我是否同意你的“耦合”注释。我们已经全局耦合了控制器和服务-我们无法在运行时以编程方式替换服务的实现。这意味着单个控制器可以获得单个服务。但是-指令在页面上的每个标记都有独立的配置，因此我们可能会为不同的指令实例启用不同的服务。似乎我认为这是一个更好的解决方案，因为它在缩小代码后仍然有效。我必须在返回{}之前添加“_myData=myData”然后在link函数中引用对象作为_myData。谢谢@Jelling。我必须做同样的事情。我想知道是否有人能告诉我们为什么…？在指令中注入$compile有什么特别的原因吗？它似乎没有在任何地方使用。如果你想在指令呼叫？

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