如何將過濾器傳遞給Angular中的指令？

Question

與this question類似，我有一個指令，我想在兩種不同的情況下使用。我傳遞了一個可以使用的值，但我也想通過一個過濾器來應用它。這樣做的正確語法是什麼？

app.directive('showMe', function() { 
    return { 
    restrict: 'E', 
    scope: { 
     value: '=', 
     filter: '=', 
     placeholder: '=' 
    }, 
    templateUrl: 'show-me.html' 
    }; 
}); 

模板：

<input ng-model="value" ng-show="editMode" placeholder="{{placeholder}}" /> 
<p ng-hide="editMode">{{(value | percent)||placeholder}}</p> 

使用：

<show-me value="item.discount" filter="percent" placeholder="0%" /> 

預期的結果：

<input value="25" placeholder="0%" /> 
or 
<p>25%</p> 

Answer 1

你可以在一個基本水平實現這一目標通過使用下面的方法;只需在您的指令控制器中使用過濾器提供程序來解析給定的值。例如：

<my-directive value="1461782417" filter="date"></my-directive> 

在「myDirective」你可以很容易地實現濾波器是這樣的：

angular 
    .module('myApp') 
    .directive('myDirective', { 
    restrict: 'E', 
    template: '<span>{{displayValue}}</span>', 
    scope: { 
     value: '=', 
     filter: '=' 
    }, 
    controller: ['$scope', '$filter', function ($scope, $filter) { 
     // Pass the value 
     $scope.displayValue = $filter($scope.filter)($scope.value); 
    }] 
    }); 

Answer 2

.filter('percent', function() { 
     return function (text, length, end) { 
      if (text == null || text == '') text = '0'; 
      text = parseInt(text)/100; 
      return text.toFixed(2); 
    };