jesusbotella/ngx-lazy-load-images

attr.data-src not working

Alex61NN5 opened this issue · 7 comments

Cant get attr.data-src to work with interpolated data

<div *ngFor="let ourwork of ourworks" lazy-load-images>
    <div class="wide {{ourwork.className}}">
	    <div class="page-wrap">
		    <img class="logo" attr.data-src="{{ ourwork.imgSrc }}"><br>
		    <h2>{{ourwork.h2Title}}</h2>
		    <h3>{{ourwork.h3Title}}</h3>

		    <p class="short-description">{{ourwork.shortDescription}}</p>
		    <a routerLink="{{ourwork.routerLink}}" class="button {{ourwork.buttonColor}}">View More</a>
	    </div>
     </div>
 </div>

No console errrors, images arent showing up... works perfectly when you use

data-src="website.com/url"

but I obviously want to use interpolation so I don't have write that 100 times

Hello @Alex61NN5!
Thank you for using this library to lazy load the images in your Angular application.

I have just checked the use case you describe here and it works for me.
Which angular version are you using? Can you please provide me an example where I can reproduce the error, or paste the DOM tree that was generated?

Im currently running

Angular CLI: 1.6.6
Node: 9.2.1
OS: win32 x64
Angular: 5.1.0
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

@angular/cli: 1.6.6
@angular/service-worker: 5.2.1
@angular-devkit/build-optimizer: 0.0.42
@angular-devkit/core: 0.0.29
@angular-devkit/schematics: 0.0.52
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.9.6
@schematics/angular: 0.1.17
typescript: 2.4.2
webpack: 3.10.0

Yes, I have tried with Angular 5.1.0 as well, but I have been unable to reproduce the error. Can you provide me any code so that I can reproduce the error?

I'm also using Angular 5 with similar versions as Alex's. I had the similar issue that only data-src worked but it did not lazy-load the images. However I figured out that I forgot to import LazyLoadImagesModule. After correcting it, it worked perfectly.

P.S: @jesusbotella Thank you for making this module.

Yes, but the comment said that it was working with hardcoded strings, so I thought that it was loaded without errors. 🤔

Thanks to you @harryhoang for using it 😁

I am also using this library and it worked for me without any issues. Thanks @jesusbotella for this contribution.

Thank you @nikunjtilva!

I think I am going to close this issue. Feel free to reopen it if you face something similar.