why angular is making 2 http post req - angularjs

Question

li
a.accordion-trigger(href='#accordion4', data-accord-group='group1')
p(style='color:white;') 2. Subjects Average Pass Percentage :
#accordion4.accordion-content.collapsed(ng-controller='ListController2', scroll='')
form(ng-submit='addNew()')
table.table.data.table-bordered
thead
tr
th Subject Name
th Year-Sem-Branch-Sec
th No.of.Students Appeared (A)
th Passed (B)
th Pass Percentage (B/A*100)
th
input.btn.btn-primary.add.pull-right(type='submit', value='Add New')
tbody
tr(ng-repeat='subjectAverage in subjectAverages')
td.data
input(type='text', ng-model='subjectAverage.subjectName', required='')
td.data
input(type='text', ng-model='subjectAverage.yearSem', required='')
td.data
input(type='text', ng-keyup='calculatePercentage(subjectAverage)', ng-model='subjectAverage.studentsAppeared', required='')
td.data
input(type='text', ng-keyup='calculatePercentage(subjectAverage)', ng-model='subjectAverage.studentsPassed', required='')
td.data
input(type='text', ng-model='subjectAverage.percentage', disabled='disabled')
td
input.btn.btn-danger.pull-right.delete(type='button', ng-click='removeRow($index)', value='Remove')
table
tr
td Average :
td
input(type='text', ng-model='subjectAverages[0].average')
h3 Faculty text box (optional):
.form-group
textarea#comment.form-control(rows='3', ng-model='subjectAverages[0].facultyComment')
button.btn.btn-default(type='submit', ng-click='saveavg()') Save
this is .pug code
angular controller code
var app = angular.module("myapp", []);
app.controller("ListController2", ['$scope','getAverage', '$rootScope','postSubAverage',function($scope,getAverage,$rootScope,postSubAverage) {
$scope.subjectAverages = [{
'subjectName': '',
'yearSem': '',
'studentsAppeared': '',
'studentsPassed':'',
'percentage':'',
'average':'',
'facultyComment':'',
'point':''
}];
$scope.calculatePercentage = function(val) {
val.percentage = (parseFloat(val.studentsPassed)*100)/parseFloat(val.studentsAppeared);
$scope.calAverage();
};
$scope.addNew = function(personalDetail) {
$scope.subjectAverages.push({
'subjectName': "",
'yearSem': "",
'studentsAppeared': "",
'studentsPassed':"",
'percentage':""
});
};
$scope.parseFloat = function(value) {
return parseFloat(value);
};
$scope.removeRow=function(index){
// remove the row specified in index
$scope.subjectAverages.splice( index, 1);
$scope.calAverage();
// if no rows left in the array create a blank array
if ($scope.subjectAverages.length() === 0){
$scope.subjectAverages = [];
$scope.calAverage();
}
};
$scope.calAverage=function()
{
var total =0;
angular.forEach($scope.subjectAverages,function(item){
total += item.percentage;
});
$scope.subjectAverages[0].average = (total/$scope.subjectAverages.length).toFixed(2);
if($scope.subjectAverages[0].average>=90)
$scope.subjectAverages[0].point=20;
else if(($scope.subjectAverages[0].average>=80)&&($scope.subjectAverages[0].average<90))
$scope.subjectAverages[0].point=15;
else if(($scope.subjectAverages[0].average>=70)&&($scope.subjectAverages[0].average<80))
$scope.subjectAverages[0].point=10;
else if(($scope.subjectAverages[0].average>=60)&&($scope.subjectAverages[0].average<70))
$scope.subjectAverages[0].point=5;
else
$scope.subjectAverages[0].point=0;
}
$scope.isDisabled = false;
$scope.saveavg=function(){
$scope.isDisabled = true;
$rootScope.progressBarValue=($rootScope.progressBarValue+$scope.subjectAverages[0].point);
$rootScope.progressBar=(10/8)*$rootScope.progressBarValue;
getAverage.subAverage($scope.subjectAverages[0].average);
postSubAverage.postData($scope.subjectAverages);
}
}]);
app.service("postSubAverage",['$http',function($http){
return{
postData:function(subAverage){
$http({
url: '/appraisalform/subaverage',
method: "POST",
data: subAverage,
headers: {
'Content-Type': 'application/json'
}
}).then(function(postData){ //.success is deprecated,so use .then
alert("Updated Successfully");
})
.catch(function(err){//using .catch instead of .error as it is deprecated
console.log("Error in request =>", err)
})
}
}}])
when i click on save button
router.post is fired
router.post('/subaverage',function(req,res){
console.log("deepak");
});
but the problem is deepak is written is console immediately but the after some time its again apperring
deepak
POST /appraisalform/subaverage - - ms - -
deepak
i am using angular + javascript in the pug file.
can anyone help with this.
thankyou

Answer 1

Could be tried this :
$scope.saveavg=function(event){
$scope.isDisabled = true;
$rootScope.progressBarValue=($rootScope.progressBarValue+$scope.subjectAverages[0].point);
$rootScope.progressBar=(10/8)*$rootScope.progressBarValue;
getAverage.subAverage($scope.subjectAverages[0].average);
postSubAverage.postData($scope.subjectAverages);
event.preventDefault();
}
Because the second called could be by native navigator.
And other idea is using ng-submi t only, and not using click and submit.
Expect it helps.
tks