javascript - Summing table rows generated with AngularJS by using jQuery -


it maybe sounds weird based in following table need sum rows using jquery. i'm using angularjs list users need each row jquery , show sum of them.

the problem don't know how value of each row in order make operation.

html

<div data-ng-app="app" data-ng-controller="controllerapp"> <table border="1">     <thead>         <tr>             <th>name</th>             <th>age</th>         </tr>    </thead>    <tbody>          <tr data-ng-repeat="user in users">              <td>{{user.name}}</td>               <td class="sum">{{user.age}}</td>          </tr>    </tbody>    <tfoot>          <tr>               <td><strong>sum</strong></td>               <td></td>          </tr>    </tfoot> </table> </div> 

javascript

$(function(){ function tally (selector) {     $(selector).each(function () {         var total = 0,             column = $(this).siblings(selector).andself().index(this);         $(this).parents().prevuntil(':has(' + selector + ')').each(function () {             total += parsefloat($('td.sum:eq(' + column + ')', this).html()) || 0;         })         $(this).html(total);     }); } tally('td.total'); }); 

angularjs

var app = angular.module("app", []); app.controller("controllerapp", function($scope){     $scope.users = [         {name: "marie", age: 24},         {name: "andy", age: 26},         {name: "peter", age: 21},         {name: "elizabeth", age: 23},         {name: "frank", age: 27},         {name: "claire", age: 25}     ] }); 

the best solution not modification outside of angulars scope
read this: "thinking in angularjs" if have jquery background?

but if must access outside of angular correct way it:

$('table').scope().users.reduce((a,b) => a+b.age, 0) 

i more this:

$scope.users = [     {name: "marie", age: 24},     {name: "andy", age: 26},     {name: "peter", age: 21},     {name: "elizabeth", age: 23},     {name: "frank", age: 27},     {name: "claire", age: 25} ]  $scope.totally = $scope.users.reduce((a,b) => a+b.age, 0) // <td class="total">{{totally}}</td> 

Comments

Popular posts from this blog

sql server - Cannot query correctly (MSSQL - PHP - JSON) -

php - trouble displaying mysqli database results in correct order -

C++ Linked List -