How to use filter for ng-repeat loop in AngularJS?

Question

I'm working on an ng-repeat that it will fill a div from a collction o object I have field called videos.description in those object with a large value so i want to change his value to a short value using filter this my code :

<div class="panel panel-default videoPanel" ng-repeat="video in videos.data | shortDescription :'video.description'">
    <h6 style="text-align: center">{{video.name}}</h6>
    <div class="panel-body" style="margin-top:-50px;">
        <video width="100%" height="190" controls style="margin:auto">
            <source src="test.mp4" type="video/mp4"> Your browser does not support the video tag.
        </video>
        <input id="input-7-xs" class="rating rating-loading" value="1" data-min="0" data-max="5" data-step="0.5" data-size="xs">
        <p>{{video.description}}</p>
    </div>
</div>

And this my filter :

app.filter('shortDescription', function() {
  return function(items, field) {
        var result = [];
        length=40;
        angular.forEach(items, function(value, key) {
            items[key].value=value.description.substring(0, length);
            console.log(field);
            result.push(items[key]);
        });
        return result;
    };
});

using this filter I still have a large value in the field description can someone help me thanks in advance

Answer 1

The problem is this line:

items[key].value=value.description.substring(0, length);

You have to update the description:

items[key].description=value.description.substring(0, length);

For this functionality, you can use map method, which accepts a callback function.

return items.map(function(item){
   return {"name":item.name,"description":item.description.substring(0,length)};
});