Dynamic image URLs

[simonwalsh]

Hey!

First, thanks for this module... It really saved me a lot of time!

I am trying to make it work with image URLs that are rendered by angular instead of having to hardcode them (serverside or manually).

Ideally, this would work but it doesn't:

<div afkl-lazy-image="{{item.portrait_small_url}} 480w, {{item.portrait_normal_url}} 768w, {{item.portrait_tiny_url}}" class="..."></div>

After doing some testing, here is what works (aside from the hardcoded string of course):

<!-- manually doing the string concatenation ->
<div afkl-lazy-image="{{item.portrait_small_url + ' 480w, ' + item.portrait_normal_url + ' 768w,' + item.portrait_tiny_url}}" class="..."></div>

<!-- $scope.fullString is the complete string with the breakpoints ->
<div afkl-lazy-image="{{fullString}}" class="..."></div>

Is this something we could easily add as supported ? I would find it super useful and way cleaner then the other options.

Thanks in advance!

[SquadraCorse]

Hi, in the sample you can see you can serve them by angular as well (sample in bottom). I guess you get the image urls all from service so making the fullString in your service/model should be easy to do? Because you have to find out first if resource is even given and then set the complete string accordingly. It saves angular digest cycle as well :) Why do you think that $scope.fullString is bad?

[SquadraCorse]

Here is another example where we render with angular the fullString based on dynamic enriched values: http://www.klm.com/destinations/ca/en/search

[simonwalsh]

I understand in some cases it is totally fine and I see your point for saving an extra of those $digests.

But still when used in directives templates for instance or in a simple ng-repeat you can see the value of building those strings on the fly. Moreover, I wanna keep the whole breakpoint logic out of my directives, etc. and at least having them in the templates makes it cleaner in my mind.

Thoughts?

Notwithstanding the above, I can I can always do a manual concat... It is not the biggest deal in the world!

[SquadraCorse]

We want to be able to have it flexible enough without making the options too complex. The directive itself optionally can contain pre-setup breakpoints (when it is rendered in backend, but still the logic is in our image template itself just getting meta data what to output). BUT as stated that can also be in your controller/service telling which rules do apply and what output string should be (in our case we get enriched data, then transform this into our page model to repeat then we output the directive, the directive itself is only using model data like: ratio, string, type etc).

[simonwalsh]

Fine by me! I will close this issue ;)