javascript - How to get width of an element from an ng-click without Jquery in AngularJS? -

i dynamically width of div.progress-bar ng-click. function move($event) on element div.progress-bar returns event element div.progress-bar. when click on div.time inside div.progress-bar, returns event element div.time.

i want width of progress-bar click on children.

html :

    <div class="progress-bar" ng-click="move($event)">         <div class="time" ng-style="{'width': (current_track.time_current / current_track.time_total * 100) + '%'}"></div>     </div> 

controller :

$scope.move = function(e) {     console.log(e);     console.log(e.srcelement.offsetwidth);     var widthofprogressbar = e.srcelement.offsetwidth;     /* ... */ }; 

you have check if clicked element .progress-bar, , if not, fetch parent element:

var bar = e.srcelement.classname === 'time'     ? e.srcelement.parentnode     : e.srcelement;  var widthofprogressbar = bar.offsetwidth; /* ... */ 

or alternative more angular/jqlite way:

var element = angular.element(e.srcelement),     bar = (element.hasclass('time') ? element.parent() : element)[0];  var widthofprogressbar = bar.offsetwidth; /* ... */