How do I pass an array into a directive without it turning into a string?

Question

Righty, so I'm just getting into directives and they seem pretty awesome. I ran into a problem though:

I need to pass an array of images into a directive so I can filter them by certain criteria. Here's my html invoking the directive:

<img cover="{{challenge.images}}">

This is my directive:

myproject.directive('cover', function() {
    return {
        link: function ($scope, element, attrs) {
            console.debug("attrs.cover", Array(attrs.cover));
        }
    };
});

The output is a String. is there a way to prevent attr turning into a String?

Answer 1

I'm assuming here that you don't want to create isolated scope, so:

myproject.directive('cover', function($parse) {
    return {
        link: function ($scope, element, attrs) {

            var covers = $parse(attrs.cover)($scope);
            console.debug("attrs.cover", covers);
        }
    };
});

and then use the directive like so:

<img cover="challenge.images">