nodejs + multer + angularjs per il caricamento senza reindirizzamento

Question

Sto usando Nodejs + Multer + angularjs per caricare i file sul server.

Ho un semplice file HTML:

<form action="/multer" method="post" enctype="multipart/form-data"> 
<input type="file" id="photo" name="photo"/> 
<button id="Button1">Upload</button> 
</form> 

Nodejs parte:

var multer = require('multer'); 

var storage = multer.diskStorage({ 
    destination: function (req, file, cb) { 
     cb(null, './uploads/') 
    }, 
    filename: function (req, file, cb) { 
     cb(null, file.originalname) 
    } 
}) 

app.post('/multer', upload.single('photo'), function (req, res) { 
    res.end("File uploaded."); 
}); 

questo funziona perfettamente e il file viene caricato con successo.

ma questo reindirizza a "/ multer" dopo aver caricato il file (a causa dell'elemento modulo).
Come rimanere sulla stessa pagina ?? ..possibly utilizzando angularjs
Così ho provato questo:

fare un file HTML angolare:

<section data-ng-controller="myCtrl"> 
<input type="file" id="photo" name="photo"/> 
<button id="Button1" ng-click="f()">Upload</button> 
</section> 

e un controller Angularjs:

angular.module('users').controller('myCtrl',[$scope,function($scope){ 
    $scope.f=function(){ 
     var photo = document.getElementById('photo'); 
     var file = photo.files[0]; 
     if (file) { 

      //code to make a post request with a file object for uploading????? 

      //something like.. 
      //$http.post('/multer', file).success(function(response) { 
      //console.log("success"); 
      //}); 
     } 
    } 
}]); 

qualcuno può aiutarmi con IL CODICE PER EFFETTUARE UNA DOMANDA POSTALE CON UN OGGETTO FILE PER CARICARE UTILIZZANDO MULTER DA ANGULARJS CONTROLLER?

grazie

Answer 1

Angularjs direttiva:

angular.module('users').directive('fileModel', ['$parse', function ($parse) { 
return { 
    restrict: 'A', 
    link: function(scope, element, attrs) { 
     var model = $parse(attrs.fileModel); 
     var modelSetter = model.assign; 

     element.bind('change', function(){ 
      scope.$apply(function(){ 
       modelSetter(scope, element[0].files[0]); 
      }); 
     }); 
    } 
}; 
}]); 

angolare file html:

<input type="file" file-model="myFile"/><br><br> 
<button ng-click="uploadFile()">Upload</button> 

Angularjs Controller:

route file server di

Nodejs:

var multer = require('multer'); 
var storage = multer.diskStorage({ 
    destination: function (req, file, cb) { 
     cb(null, './uploads/') 
    }, 
    filename: function (req, file, cb) { 
     cb(null, file.originalname+ '-' + Date.now()+'.jpg') 
    } 
}); 
var upload = multer({ storage: storage }); 

app.post('/multer', upload.single('file')); 

Enjoy!