Infdig error when converting strings to objects in filter

69 Views Asked by At

I want to write a filter that converts array of strings to array of objects (it is simplification of my original problem). So, the ['a', 'b'] should become [{id: 'a', label: 'A'}, {id: 'b', label: 'B'}].

However, my solution results in infinite digest cycle error.

angular.module('MyTestApp', []).filter('propertiesWithLabels', function() {
  return function(properties) {
    var propertiesWithLabels = [];
    for (var i = 0; i < properties.length; i++) {
      propertiesWithLabels.push({
        id: properties[i],
        label: properties[i].toUpperCase()
      });
    }
    return propertiesWithLabels;
  };
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="MyTestApp">
  <div ng-init="myObject = {properties: ['a','b','c']}">
    <ul>
      <li ng-repeat="property in myObject.properties | propertiesWithLabels">
        {{ property.id }}: {{ property.name }}
      </li>
    </ul>
  </div>
</div>

I do not modify the model as in this question $rootScope:infdig error caused by filter?. Why does this error occur?

0

There are 0 best solutions below