You would want to calculate the subtotals in the controller. Your problem is that you want the subtotals to update according to the filters that are applied on view. You can achieve this by injecting $filter into your controller.
Have a look at the plunk here: http://plnkr.co/edit/JwUOzm5u3G7379I1W6hk?p=preview
I created a filter in an input box. Try changing the text, the subtotals update accordingly.
In this case I use the 'filter' filter both in the view as well as the controller so that the view and the subtotal update simultaneously.
Code below:
<!DOCTYPE html>
<html>
<head>
<script data-require="angular.js@*" data-semver="1.3.1" src="//code.angularjs.org/1.3.1/angular.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body ng-app="app">
<div ng-controller="mainCtrl as main">
<input type="text" ng-model="main.empName" placeholder="name filter">
<div ng-repeat="year in main.data">
{{year.yearNum}}:{{main.calculateTotal(year.yearNum)}}
<div ng-repeat="employee in year.employees|filter:main.empName">
{{employee.name}} : {{employee.cost}}
</div>
</div>
</div>
<script>
angular.module('app',[])
.controller('mainCtrl',function($filter){
var main=this;
main.calculateTotal=function(yearNum){
var data=main.data;
var total=0;
for(var i=0;i<data.length;i++){
if(data[i].yearNum==yearNum)
{
var employees=$filter('filter')( main.data[i].employees, main.empName );
for(var j=0;j<employees.length;j++){
total+=employees[j].cost;
}
}
}
return total;
}
main.data=[
{
yearNum:2012,
employees:[
{
name:"jane",
cost:200
},
{
name:"jow",
cost:400
}
]
},
{
yearNum:2013,
employees:[
{
name:"jane",
cost:250
},
{
name:"jow",
cost:450
}
]
}
];
});
</script>
</body>
</html>
