在AngularJS中使用FileReader＆DOMParser

问题描述：

我有一个用户上传的文件，使用AngularJS并喜欢使用XML操纵文件内容。但是，我在DOMParser识别文本文件时遇到困难。在AngularJS中使用FileReader＆DOMParser

的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);

在这个例子中，txtfile注册表被正确地打印到控制台时，Reader.onLoad内。但是，xmlDoc显示为未定义。

我应该引用该文件并将其转换为可以被DOMParser读取？注意：如果我在... xmldoc = parser.parseFromString（“bob”，“text/xml”）中替换txtFile，代码将起作用。

在此先感谢。

答

我知道这是旧的，但我想如果人们仍然遇到此

var parser = new DOMParser(); 
var reader = new FileReader(); 
reader.readAsText(file, "UTF-8"); 
reader.onload = function (evt) { 
    var data = parser.parseFromString(evt.target.result, "application/xml"); 
    console.log(data); 
};

这里掉落的工作示例

在AngularJS中使用FileReader＆DOMParser

相关推荐