Importieren von Dateien mit Angular.js und C#

Question

Ich baue ein Umbraco7-Paket und bin ein wenig still. Ich habe sehr wenig Erfahrung mit Angular und C# und was ich versuche zu tun ist eine Import-Option hinzufügen, wo ein Backoffice-Benutzer eine xls-Datei importieren und eine vorhandene Datenbanktabelle mit den xls-Inhalten auffüllen kann.

Das ist, was ich bis jetzt habe, ich bin nicht sicher, wie man es erhält, um die Datei an der ersten Stelle zu speichern, geschweige denn die Werte aus der XLS-Datei zu extrahieren.

HTML

// This is the view (table.html) 
// Excluding the export blank xls file table. 

<div class="import-div"> 
    <input type="file" name="MyFile" /> 
    <input type="submit" class="btn btn-danger" ng-click="ButtonClickHandler()" /> 
</div> 

Angularjs-Controller

Datei

// Here is my js controller file: 

    angular.module("umbraco") 
     .controller("ImportCtrl", function ($scope, keyResource) { 
      $scope.ButtonClickHandler = function() { 
       console.log("I was clicked!"); 
      }; 
     }); 

C#-Controller

//This is the C# controller. 

     using AngularUmbracoPackage.Models; 
     using System; 
     using System.Collections.Generic; 
     using System.Linq; 
     using System.Web.Mvc; 
     using System.Web.Security; 
     using umbraco.cms.businesslogic.member; 
     using Umbraco.Web.Mvc; 
     using Umbraco.Core.Persistence; 
     using System.Configuration; 
     using Umbraco.Core.Logging; 
     using System.Data; 
     using System.Text; 
     using System.IO; 
     using System.Web; 
     using System.Net.Http; 

     namespace AngularUmbracoPackage.App_Code 
{ 

    [HttpPost] 
    public class ImportNewDictionaryController 
    { 
     [HttpPost] 
     public ActionResult importFile() 
     { 
      public string fileName; 
     public string DictionaryKey; 

     var db = UmbracoContext.Application.DatabaseContext.Database; 
     var insert = new Sql("INSERT INTO cmsDictionary VALUES('" + DictionaryKey + "'"); 

     } 


    } 
} 

mir jemand Kann keine Links geben, die helfen können, oder mich durch das?

Answer 1

So habe ich es geschafft zu arbeiten!

using UmbracoImportExportPlugin.Models; 
using System; 
using System.Collections.Generic; 
using System.IO; 
using System.Linq; 
using System.Net; 
using System.Web; 
using System.Web.Mvc; 
using Umbraco.Core.Persistence; 
using Umbraco.Web; 
using Umbraco.Web.WebApi; 

namespace UmbracoImportExportPlugin.App_Code 
{ 

    public class ImportNewDictionaryController : UmbracoAuthorizedApiController 
    { 
     public string basePath; 

     //Locate specific path 
     public void LocatePath() 
     { 
      this.basePath = System.Web.Hosting.HostingEnvironment.MapPath(@"/upload"); 
     } 
     [System.Web.Http.AcceptVerbs("GET", "POST")] 
     //[System.Web.Http.HttpPost] 
     public void SaveFile() 
     { 
      var myContext = Request.TryGetHttpContext(); 
      List<string> keys = new List<string>(); 
      if (myContext.Success) 

      { 
       HttpPostedFileBase myFile = myContext.Result.Request.Files["file"]; 
       if (myFile == null) 
       { 
        throw new HttpException("invalid file"); 
       } 
       else 
       { 
        StreamReader csvreader = new StreamReader(myFile.InputStream); 


        while (!csvreader.EndOfStream) 
        { 
         var line = csvreader.ReadLine(); 
         if (line != "Key") 
         keys.Add(line); 
        } 
       } 
       UmbracoDatabase db = ApplicationContext.DatabaseContext.Database; 
       var remove = new Sql("DELETE FROM cmsDictionary"); 
       int rem = db.Execute(remove); 
       foreach (string item in keys) 
       { 
        var insert = new Sql("INSERT INTO cmsDictionary VALUES (NEWID(), null,'" + item + "')"); 
        int res = db.Execute(insert); 
       } 
      } 
     } 


    } 
} 

Answer 2

Dieser arbeitete für mich vor

in Ihrer js-Datei (oder vor Ihrem Winkelregler):

angular.module("umbraco").directive("qwSingleFileUpload", function() { 
    return { 
     restrict: "A", 
     replace: false, 
     scope: { 
      myValue: '=qwSingleFileUpload' 
     }, 
     link: function (scope, element, attr) { 
      element.bind('change', function() { 
       scope.myValue = element[0].files[0]; 

       if (scope.$$phase) { 
        scope.$apply(); 
       } 
      }); 
     } 
    } 
}); 

in Ihrem controller.js:

$scope.fileUpload = {}; 
$scope.doUpload = function() { 
    var uploadUrl = "/umbraco/api/storelocator/go/"; 
    var fd = new FormData(); 

    fd.append('file', $scope.fileUpload); 

    $http.post(uploadUrl, fd, { 
     transformRequest: angular.identity, 
     headers: { 'Content-Type': undefined } 
    }) 
    .success(function (data) { 
     // ok 
    }) 
    .error(function() { 
     // handle upload error 
    }); 
} 

Ihre Ansicht:

<input type="file" qw-single-file-upload="fileUpload" /><br /> 
<br /><br /> 
<input type="button" ng-click="doUpload()" value="Upload" /> 

in Ihrem Codebehind:

StoreLocatorController : UmbracoAuthorizedApiController // this allows only logged in users to call the api and also ensures that the correct umbraco context is set 
{ 
    public string basePath; 

    public StoreLocatorController() 
    { 
     this.basePath = System.Web.Hosting.HostingEnvironment.MapPath(@"/App_Data/storeLocatorUpload/"); 
    } 


    [HttpPost] 
    public void Go() 
    { 
     var myContext = Request.TryGetHttpContext(); 
     if (myContext.Success) 
     { 
      HttpPostedFileBase myFile = myContext.Result.Request.Files["file"]; 
      if (myFile == null) 
      { 
       throw new HttpException("invalid file"); 
      } 
      // save the file 
      myFile.SaveAs(this.basePath + "file.ext"); 



      UmbracoDatabase db = ApplicationContext.DatabaseContext.Database; 
      // parse the data and insert them using UmbracoDatabase db 
      //.. 
     } 



    } 
}