Angular Upload Textdatei dann Inhalt

Question

Ich versuche herauszufinden, wie man einen Text/XML-Datei Inhalt, der auf meine WebApp hochgeladen wird. An diesem Punkt will/muss ich nicht auf den Server drücken, ich möchte einfach den Inhalt/Text der Datei bekommen.

Hier ist, was ich bisher getan haben: xmlDiff.html:

<div id="xmlDiff-div" class="wrapper"> 
    <div class="configurationView "> 
     <div class="panelHeader">Upload XML Files</div> 
     <div class="treeWrapper panelBody"> 
      <button ngf-select="uploadLeftFile($file)" accept="xml/*" ngf-max-height="1000" ngf-max-size="2MB"> 
       Upload Left File</button> 
      <br><br> 
      <button ngf-select="uploadRightFile($file)" accept="xml/*" ngf-max-height="1000" ngf-max-size="2MB"> 
       Upload Right File</button> 
      <br><br> 
     </div> 
    </div> 
    <div id="diff_editors_div"> 
     <div class="panelheader sectionHeader">XML Diff Results</div> 
     <div id="compare"></div> 
    </div> 
</div> 

Nun, hier ist mein Controller:

app.controller('XmlDiffCtrl', ['$scope', '$q', '$location', '$timeout', function ($scope, $q, $location, $timeout) { 
    $('#compare').mergely({ 
     cmsettings: {readOnly: false, lineNumbers: true}, 
     ignorews: true, 
     width: 'auto', 
     height: 'auto', 
     lhs: function (setValue) { 
      setValue('paste left XML here'); 
     }, 
     rhs: function (setValue) { 
      setValue('paste right XML here'); 
     } 
    }); 
    $scope.uploadRightFile = function (file) { 
     console.log("Upload Right File has been called"); 
     console.log("file content :" + file); 
     $scope.rightFileText = file.data; **doesn't work, need an alternative** 

    }; 
    $scope.uploadLeftFile = function (file) { 

    }; 
}]); 

Nur als Anmerkung, ich bin ein Anfänger Angular Entwickler also, wenn jemand meine Angular-Skills kaputt machen will, gehe direkt vor, aber ich brauche hauptsächlich Hilfe, um herauszufinden, wie ich nach dem Hochladen auf den Inhalt der Datei zugreifen kann.

Lassen Sie mich wissen, wenn ich nicht klar genug war, wenn Sie weitere Informationen benötigen.

Answer 1

Try this:

function handleFiles(file) { 
    var reader = new FileReader(); 
    reader.onload = function(e) { 
    $scope.rightFileText = e.target.result; } 
    reader.readAsDataURL(file); 

}