Web Dev Tuts

/ Stuffs About Website Development /

Menu
  • Home
  • Wp Plugins
  • How To
  • FAQ
    • GIT
    • JQuery
    • PHP
    • WooCommerce
    • WordPress
  • Contact Us
Menu

Lazy Loading With AngularJS

Posted on June 5, 2017September 24, 2017 by admin

HTML

<div style="display: none" angular-lazy-load class="photos portfolio-item item-{{$index}}" ng-repeat="item in items | filter:filter_alphabet:startsWith" ng-cloak>
        <div class="p-inner background-delay" data-img="{{item.p_details.hover_bg}}"><div class="border">
		<div class="item-content">
			<div class="logo-cont">
				<span>
				        <img src="{{item.p_details.logo}}" />
				</span>
			</div>
			<div class="p-text">
				<h2 class="p_title">{{item.post_title}}</h2>
				<p>{{item.p_details.phone_num}}</p>
			</div>
		</div>
	</div>
</div>

Scripts

var myApp = angular.module('soccerCampApp', ['angular-lazy-loader']);

myApp.controller('CtrlPortfolio', ['$scope', function($scope) {
	//codes here
});

Download and include lazy-loader.min.js.

Category: AngularJs

Leave a Reply Cancel reply

You must be logged in to post a comment.

Recent Posts

  • How to add wp_editor Dynamically
  • How to Hide Certain Pages from Certain Users (WP Dashboard)
  • How to Set Up Gmail SMTP
  • How to Set Up Virtual Host in Localhost & Xampp
  • How to Determine the Current WordPress Version Used
  • AngularJs
  • CSS
  • For Me Only
  • geo location api
  • GIT
  • GoDaddy
  • Hosting
  • How To
  • Javascript
  • JQuery
  • Magento
  • My Notes
  • PHP
  • Private
  • Sass
  • WooCommerce
  • Wordpress
  • Xampp
© 2023 Web Dev Tuts | Powered by Minimalist Blog WordPress Theme