I have a user uploaded file using AngularJS and would like to manipulate the file contents using XML. Unfortunately, I am facing an issue with the DOMParser recognizing the text file.
index.html
<div ng-controller = "myCtrl">
<input type="file" file-model="myFile"/>
<button ng-click="uploadFile()">upload me</button>
</div>
app.js
myApp.controller('myCtrl', ['$scope', 'fileUpload', function($scope, fileUpload){
$scope.uploadFile = function(){
var file = $scope.myFile;
reader = new FileReader();
reader.onload = function() {
showout.value = this.result;
txtFile = showout.value;
console.log(txtFile);
};
reader.readAsText(file);
parser=new DOMParser();
xmldoc = parser.parseFromString(txtFile,"text/xml");
console.log(xmlDoc);
While the txtFile is printed correctly to the console in the Reader.onLoad section of this example, xmlDoc is showing as undefined.
How should I reference the file and convert it so that it can be read by DOMParser?
NOTE: If I replace txtFile in ... xmldoc = parser.parseFromString("bob","text/xml"), the code works as expected.
Thank you in advance.