File uploading issue in Angularjs - angularjs

Question

I am uploading an .csv file using below code and it works perfectly. But I am facing one issue during the upload. When I the choose the .csv for the first time, submit button will get enabled, but when I choose the wrong file instead of .csv, button is not getting disabled. If I want to clear the selected file the clear button is not working. I am not to figure it out what is wrong.
Below is the code of controller where upload file functionality take place:
Html:
<div class="col-md-2" >
<input type="file" id="file1" name="file" ng-model="searchData" ng-files="getFiles($files)" multiple/>
</div>
<div class="col-md-2" style="padding:17px 0px 0px 55px">
<button type="button" ng-click="uploadFile()" ng-disabled="!flag">SUBMIT</button>
<button type="button" ng-click="clearFile()">CLEAR</button>
</div>
Angularjs:
var formData = new FormData();
$scope.getFiles = function ($files) {
var data = $files;
if (data.length > 0) {
formData.append('file1',data[0]);
var allData = formData.get('file1');
var filename = allData.name; // Here we will get file name with type
csvCheck = filename.substr(-4); // Here I am selecting the last four char, i.e (.csv)
if (csvCheck === ".csv") {
$scope.flag = true;
}
} else {
$scope.flag = false;
}
$timeout($scope.time(), 500);
};
Here is the plunker

Answer 1

Use this code to accept only CSV files :
In your HTML Use :
<input type="file" id="file1" name="file" onchange="angular.element(this).scope().getFiles(this)" multiple/>
Then in your controller use:
$scope.getFiles = function ($files) {
var validExts = new Array(".csv");
var fileExt = $files.value;
fileExt = fileExt.substring(fileExt.lastIndexOf('.'));
if (validExts.indexOf(fileExt) < 0) {
alert("Invalid file selected");
$scope.flag=false;
}
else $scope.flag=true;
}
Use this code to clear the selected file :
document.getElementById("file1").value = "";