Using a filter by directive attribute causes an endless loop in the $ digest loop

Trying to use a filter in a directive with a scope:

<div tags="p.tags | refTags"></div>

Invokes an infinite loop of the $ digest loop:

This error occurs when the application model becomes unstable, and each $ digest cycle causes a state change and subsequent $ digest cycle. Angular detects this situation and prevents an infinite loop from causing the browser to stop responding.

.directive 'tags', ->
    restrict: 'A'
    scope:
        tags: '='
    templateUrl: 'partials/tags.html'


.filter 'refTags', ->
    (tags) ->
        ['a filtered', 'array of values']

partial /tags.html

<ul>
    <li ng-repeat="tag in tags">{{tag.tag}}</li>
</ul>

p.tags in the controller

p.tags = ['HTML5', 'CSS', 'JavaScript', 'Angular JS', 'Backbone JS', 'Node JS', 'SASS + Compass', 'Oragami', 'Running', 'Cat Food', '#catfood']

Is this normal behavior?

  • Can a filter not be used for a value passed to the directive's highlight area?
  • Is there a workaround for this? I need to filter the values ​​of arrays
  • Is there any other solution with a different design?
+2
2

, , . , , , .

, $digest, , , .

, .. input = output. , , . .

+5

.

, , , .

+1

Source: https://habr.com/ru/post/1526144/


All Articles