This directive allows to scroll to a custom Node list array element inside a parent container.
Can be used along with stz-image-load directive if all of the child elements are images or contain images to scroll to a particular element only when all images are loaded or with stz-last-repeat directive to consider the ng-repeat presence and scroll after ng-repeat is rendered. Or can make use of both ng-repeat and images combined.
<ling-repeat="scroll in scrollSuperCollection"stz-s-i-v-ele="{{scroll.isActive}}"stz-last-repeat>{{scroll.title}}</li>
</ul>
Dynamic List Example With Watcher:
where scrollAwesomeIndex can be watched to be defined or any other scope param can be passed.
Let it be resolved to say 7 here and scrollAwesomeList will have 10 elements.
<ling-repeat="scroll in scrollAwesomeList track by $index"stz-s-i-v-ele="{{scroll.isActive}}"stz-last-repeat>
<imgng-src="placehold.it/8{{$index % 5}}0x6{{$index % 10}}0/8A8BA6/CACBF2/"stz-image-loadalt="I think I deserve to be scrolled to!"/>
</li>
</ul>
Dynamic List Example With Images and Watcher:
where scrollAwesomeIndex can be watched to be defined or any other scope param can be passed.
Let it be resolved to say 7 here and scrollAwesomeList will have 10 elements.
The scroll will happen only when ng-repeat is rendered, all images are loaded and scrollAwesomeIndex is resolved.