javascript 直接将服务注入 AngularJS 指令控制器
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/25111417/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Injecting services into AngularJS directive controller directly
提问by TrazeK
I understand how Angular dependency injection works with directives but wanted clarification on something. I have a dummy test directive as follows:
我了解 Angular 依赖注入如何与指令一起工作，但想澄清一些事情。我有一个虚拟测试指令如下：
app.directive("test", [
function() {
return {
restrict: "E",
scope: {},
controller: ["$scope", "$filter",
function($scope, $filter) {
var food = ["Apple pie", "Apple cobler", "Banana Split", "Cherry Pie", "Applesauce"];
$scope.favorites = $filter('filter')(food, "Apple");
}
],
template: "<div>{{favorites}}</div>"
}
}
]);
This works fine and will filter the foodarray as expected. However I noticed if I inject the $filterservice in the directive as follows, it still works:
这工作正常，并将food按预期过滤数组。但是我注意到如果我$filter在指令中注入服务如下，它仍然有效：
app.directive("test", ["$filter",
function($filter) {
return {
restrict: "E",
scope: {},
controller: ["$scope",function($scope) {...
My question: Is it better practice to inject services into a directive in the declaration line like so:
我的问题：将服务注入声明行中的指令是否更好，如下所示：
app.directive("test", ["$filter", function($filter) {
app.directive("test", ["$filter", function($filter) {
or in the controller line like this:
或在这样的控制器行中：
controller: ["$scope", "$filter", function($scope, $filter) {?
controller: ["$scope", "$filter", function($scope, $filter) {?
Is there no difference? Here is a Plunkerof the directive code.
没有区别吗？这是指令代码的Plunker。
采纳答案by Michelle Tilley
In this case, you're receiving the same service, so it likely doesn't matter too much. I personally prefer to keep them as localized as possible; if you don't need $filterin the linkfunction or something like that, I'd just inject it into the controller.
在这种情况下，您将获得相同的服务，因此这可能并不重要。我个人更喜欢让它们尽可能本地化；如果你不需要做$filter在link功能或类似的东西，我只是把它注射到控制器。
In certain cases, this may also make it easier to mock dependencies during testing.
在某些情况下，这也可以更容易地在测试期间模拟依赖项。
回答by Mr_Perfect
You can do this also. Much better way by splitting directive and its controller in a single file. Or you can write in separate files. But, better understand
你也可以这样做。通过在单个文件中拆分指令及其控制器更好的方法。或者你可以写在单独的文件中。但是，更好地理解
app.directive('throbberDirective',
[
function(){
return {
restrict: "EA",
templateUrl: "common/utils/throbbers/throbber.html",
controller: throbberController
}
}
]);
app.controller('throbberController', throbberController);
throbberController.$inject = ['$scope', '_$ajax'];
function throbberController($scope){
$scope.throbber = _$ajax.getThrobberConfigs();
$scope.throbber.templateName = $scope.throbber.templateName;
}
