我有一个模板的指令，看起来像：
<span> {{foo.bar}} {{foo.car}} {{foo.dar}}</span>
在多个位置调用。它的调用方式是：
<foo-dir foo="fooData"></foo-dir>
有没有办法在html指令标签中应用自定义过滤器而不是在指令本身？
我希望存在如下内容：
ng-innertext-filter="filterName:params"
但这可能是一厢情愿的想法。
如果那是不可能的，有没有办法在指令控制器中使用过滤器而不必在使用该指令的任何地方应用它？
谢谢。
编辑：过滤代码：
import angular from 'angular';
function someFilter() {
return (input, filterParam) => {
if (input && filterParam && input.length)
if(filterParam)
return input.filterLogic();
return input;
}
}
在模板字符串qazxsw poi中，过滤器工作正常。但我正在寻找一种方法将过滤器应用于指令标签本身。
要做到你想要的：
从html标记中的指令对结果字符串使用过滤器
您需要创建模板字符串并重新编译DOM。
这是AngularJS的一个非常先进的用法。我希望你喜欢它 ：-）
{{somedata | someFilter}}var app = angular.module("app", []);
app.controller('ctrl', function ($scope) {
$scope.foo = {
bar: "1",
car: "2",
dar: "3"
};
});
app.directive('foodir', function ($compile) {
return {
restrict: 'E',
scope: {
foo: '=', // Bind the variable to the directive's scope
filter: '@' // Just get the string for compilation
},
link: function ($scope, $element, $attrs) {
// This is the string on which you may want to apply a filter
var string_template = '" bar:" + foo.bar + " car:" + foo.car + " dar:" + foo.dar';
// Full string to compile without filter
var html = '<span>{{' + string_template + '}}</span>';
if ($scope.filter !== undefined)
// Full string to compile with filter (optional)
html = '<span>{{' + string_template + ' | '+$scope.filter+'}}</span>';
console.log(html);
var e = $compile(html)($scope); // Convert your string to a DOM element
$element.replaceWith(e); // Make it the content of the directive
}
}
});现在，如果您只想将滤镜应用于模板的某些部分（而不是完整的字符串），则可以避免使用<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body ng-app="app" ng-controller="ctrl">
<foodir foo="foo"></foodir>
<hr/>
<foodir foo="foo" filter="uppercase"></foodir>
<hr/>
<foodir foo="foo" filter="limitTo:10"></foodir>
</body>并使用基本插值，如下所示：
string_template我不确定你问题的第一部分是什么意思。如果您想将此过滤器应用于指令的编译结果，我不确定您是否可以。不过，我可以帮助在控制器中使用过滤器。
如果您定义一个自定义AngularJS过滤器，如下所示：
var html = '<span> {{foo.bar}} {{foo.car}} {{foo.dar |' + $scope.filter + '}}</span>'
然后，您可以通过注入内置的app.filter('makeItPretty', function() {
return function(value) {
return value.toUpperCase();
};
});
服务从控制器中访问您的过滤器：
$filter