Когда использовать фильтр против директивы в Angularjs

Это простой вопрос - и, возможно, его спросили (просто не могли его найти..)

Когда вы будете использовать фильтр над директивой, когда дело доходит до манипулирования данными, или наоборот?

В действительно очень простом примере см. этот Plunkr

По существу, у меня есть следующий javascript

var app = angular.module('app', []);

app.controller('MyCtrl', ['$scope', function($scope){
  $scope.testMessage = 'Some Text'
}]);

app.directive('myDirective', function(){
    return{ 
        restrict: 'A',
        link: function(scope, element, attrs){

            // do some stuff with the data
            // 
            element.html(scope.testMessage + ' result of my directive');
        }
    }
});

app.filter('myFilter', function(){
    return function(text){
     // do something with text
        return text + ' & result of my filter';
    }
});

И следующие html

  <body ng-controller="MyCtrl">
    <div my-directive ng-model="testMessage" ></div>
    <br />
    <div>{{ testMessage | myFilter }}</div>
  </body>

Итак, когда вы будете использовать один над другим?

Ответы

Ответ 1

Некоторые подсказки (неисчерпывающие списки):

Директива

Используйте его, когда...

  • Вы хотите выполнить структурные манипуляции с DOM
  • Вы хотите добавить поведение (контроллер)
  • Результат зависит от других соавторов (конфигурация require директивы)

Фильтр

Используйте его, когда...

  • Вы преобразуете значение в другое (например, String → Date)
  • (Подмножество выше, но важно, чтобы гарантировать его собственную пулю:) Когда вы преобразуете массив (например, для отображения в повторяющихся элементах - фильтр filter и ng-repeat)

Ответ 2

Ясный и простой

Фильтр для общей фильтрации данных

Директива для DOM Манипуляция / поведение пользовательского интерфейса


В вашем случае вы можете записать его так:

  <div>{{ testMessage + ' result' }}</div>

Ответ 3

Еще одна точка, которую я хочу добавить помимо

  • Фильтр для общей фильтрации/преобразования данных
  • Директива о манипуляции с DOM Manipulation/UI

Обычно мы используем фильтры для массива данных.

Я чувствую, что между ними нет логической разницы. Оба выполняют ту же работу. Это другое использование.