angularjs-lazyloading

A simple way to lazyload scripts & css with AngularJS

add to app

"use strict";

const app = angular.module("MyApp", [ "ngLazyLoading" ]);

add to controller

"use strict";

app.directive("MyController", [ "$lazyLoading", ($lazyLoading) => {

	// private

		// attributes

			const _urlJS = "http://my-url.com/my-script.js";
			const _urlCSS = "http://my-url.com/my-style.css";

	// init

	$lazyLoading.logs = true; // default = false

	$lazyLoading.script(_urlJS).then(() => {
		return $lazyLoading.style(_urlCSS)
	}).then(() => {

		console.log("loaded");

	}).catch((err) => {
		console.error(err);
	});

}]);

load multiple files in a synchronous way

"use strict";

app.directive("MyController", [ "$lazyLoading", ($lazyLoading) => {

	// private

		// attributes

			const _urlJS = "http://my-url.com/my-script.js";
			const _urlCSS = "http://my-url.com/my-style.css";

	// init

	$lazyLoading.logs = true; // default = false

	$lazyLoading.group({
		"name": "myGroup",
		"scripts": [ _urlJS ],
		"styles": [ _urlCSS ]
	}).then(() => {

		console.log("loaded");

	}).catch((err) => {
		console.error(err);
	});

}]);