nodejs + multer + angularjs yönlendirmeden karşıya yükleme

Question

Sunucuda dosya yüklemek için Nodejs + Multer + angularjs kullanıyorum.

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

Nodejs kısmı::

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."); 
}); 

bu mükemmel çalışıyor ve dosya başarıyla yüklenir

i basit bir HTML dosyası var.

Ancak bu dosya (form öğesi nedeniyle) yükledikten sonra beni "/ kısık" olarak yönlendirir.
Nasıl aynı sayfada kalacağım ??

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

ve angularjs denetleyicisi:

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"); 
      //}); 
     } 
    } 
}]); 

KİŞİYE bana yardımcı olabilecek bir HTML açısal dosyası yapma

: bu yüzden bu çalıştı ..possibly kullanarak angularjs
ANGULARJS KONTROLÖRÜNDEN MULTER KULLANARAK YÜKLEME İÇİN BİR DOSYA İLE İLGİLİ BİR İSTEK ÜZERİNDEN KAZANMAK İÇİN KOD?

sayesinde

Answer 1

angularjs yönergesi:

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]); 
      }); 
     }); 
    } 
}; 
}]); 

Eğik html dosyası:

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

angularjs Denetleyici:

$scope.uploadFile = function(){ 

     var file = $scope.myFile; 
     var uploadUrl = "/multer"; 
     var fd = new FormData(); 
     fd.append('file', file); 

     $http.post(uploadUrl,fd, { 
      transformRequest: angular.identity, 
      headers: {'Content-Type': undefined} 
     }) 
     .success(function(){ 
      console.log("success!!"); 
     }) 
     .error(function(){ 
      console.log("error!!"); 
     }); 
    }; 

Nodejs sunucu rota dosyası:

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

tadını çıkarın!