#ng-click

[thumbikr-blog]

Basic Example of AngularJS for beginners | Part 1

[rrosarrosa]

position relative to parent using angularjs + $event

Let's make a clickable progress bar.

Build a parent div .meterBackground and a child div within it to hold the current position of the progress bar .meterPosition. This code should give you the horizontal position that was clicked within the parent element .meterBackground.

Template:

<div class="wrapper>   <div class="meterBackground">     <div class="meterPosition"></div   </div> </div>

js:

$scope.now = 0; $scope.clickMe = function(event) { $scope.now = parseInt(event.offsetX/event.target.clientWidth)*100); console.log('clicked on:' + $scope.now + '%'); }

Then you could make another div that overlaps .meterBackground and set it's width according the $scope.now, that would be the current progress bar position.

I'll make a fiddle later maybe :)