Skip to content

Instantly share code, notes, and snippets.

@accolver
Last active December 5, 2016 08:14
Show Gist options
  • Save accolver/4987806b026fd8a03568 to your computer and use it in GitHub Desktop.
Save accolver/4987806b026fd8a03568 to your computer and use it in GitHub Desktop.
ng-lazy-show
'use strict';
var ngLazyShowDirective = ['$animate', function ($animate) {
return {
multiElement: true,
transclude: 'element',
priority: 600,
terminal: true,
restrict: 'A',
link: function ($scope, $element, $attr, $ctrl, $transclude) {
var loaded;
$scope.$watch($attr.ngLazyShow, function ngLazyShowWatchAction(value) {
if (loaded) {
$animate[value ? 'removeClass' : 'addClass']($element, 'ng-hide');
}
else if (value) {
loaded = true;
$transclude(function (clone) {
clone[clone.length++] = document.createComment(' end ngLazyShow: ' + $attr.ngLazyShow + ' ');
$animate.enter(clone, $element.parent(), $element);
$element = clone;
});
}
});
}
};
}];
angular.module('yourModule').directive('ngLazyShow', ngLazyShowDirective);
@mazipan
Copy link

mazipan commented May 25, 2016

When using ng-lazy-show maybe you will lose scope because there is different behavior between ng-if and ng-show

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment