9

我已经定义了一个自定义过滤器和一个具有隔离范围的指令，当我没有将它注入指令模块时，我无法弄清楚为什么指令可以访问自定义过滤器（我已经将它注入应用程序模块——见例子）。

过滤器的范围规则是否与其他范围属性不同？或者这是在考虑过滤器时使用的错误框架？

这里的工作示例：http: //jsbin.com/IRogUxA/6/edit ?html,js,output

提前致谢！

4

2 回答 2

10

这是因为该指令是exampleApp模块创建的根范围的子级。、services和模块被注入到controllers从子范围到根范围的树上提供原型继承。如果将来某个时候创建​​的根范围将排除模块，则依赖指令可以访问过滤器是很危险的。directivesexampleApptoDatelinkBoxexampleAppservices

Erstad Stephen 在他的回答中写的是部分正确的，但他的示例在键入时不起作用，因为 $injector 要求过滤器名称具有后缀Filter. 如$filterProvider 文档中所述。

以下代码有效：

//CORE MODULE
angular.module('exampleApp',['controllers','directives']);

angular.module('controllers',[]).controller('app_ctrl',['$scope',function($scope){
  $scope.dateVal = 20131010;
}]);

angular.module('services',[]).filter('toDate',[function(){
  function func(ymd){
    ymd = ymd + "";
    var y = ymd.substring(0,4);
    var m = ymd.substring(4,6);
    var d = ymd.substring(6);
    return (+m) + "/" + (+d) + "/" + y;
  }
  return func;
}]);

//DIRECTIVE
angular.module('directives',['services']).directive('linkBox', ['toDateFilter', function(toDate){
  var dir = {
    transclude:false,
    scope:{isolateVar:'@linkBox'},
    replace:true,
    template:'<p>Filtered value: {{isolateVar | toDate}}</p>',
    link: function lfn(scope, instance, attr){
      var a = angular.element(instance); 
      a.text(scope.isolateVar.name);
      console.log(scope);
    } //end link function
  }; //end dir object
  return dir;
}]);

这是工作的 JSBin：http: //jsbin.com/ICUjuri/2/edit

于 2013-10-09T18:01:54.427 回答
2

这是因为过滤器可用于“exampleApp”模块，因为它是一个依赖项。

Adam Thomas 对此是正确的，但在其他自定义项中依赖自定义指令、服务和过滤器是一种常见情况。您希望在 DI 断言中明确说明。这将导致事情在注入级别中断，而不是在这种情况下使用自定义指令时。

//DIRECTIVE
angular.module('directives',['services']).directive('linkBox', ['toDate',function(toDate){
  ...
}]);

有了这个，您可以清楚地知道您需要使用该指令并且不会轻易错过。这可能需要您调整声明“toDate”的方式。

于 2013-10-09T18:15:16.740 回答