Question

如何使用angularjs上传文件？我需要上传.xls文件，因此需要进行扩展检查，并且还需要read数据并将其显示在表中，然后再将其发布到PHP服务器。

Answer 1

Angular是一个客户端框架，因此文件上传不会出现任何异常情况。在DOM级别，它只使用带有文件输入字段的HTML表单。

Angular方法是编写一个包装上传表单的指令。

Angular不会给你任何特别的东西来实际保存文件。在后端实现一些东西来接收正在上传的文件。这是一个常见的要求，我确信无论您使用何种语言都有一个例子。

已经写了几个指令。例如，我在最近的项目中使用了this。

Answer 2

## IN HTML : ##

 <input type="file" name="file" id="fileUpload" file-model="myFile" 
  required="required" >
   <button value="Upload" name="submit" class="btn btn-success" ng-
      click="UploadCompanyContact()" title="Click here to upload "  ng-
    hide="uploadCompanyContactForm.myFile.$error.required" >Upload</button>

## IN ANGULAR CONTROLLER : ##
$scope.UploadCompanyContact = function(){
var file = $scope.myFile;
alert(JSON.stringify(file.name));
    var uploadUrl = "/college/upload_company_contact";
    var fd = new FormData();
    fd.append('file', file);    
    $http.post(uploadUrl,fd, {

        transformRequest: angular.identity,
        headers: {'Content-Type': undefined}
    })
    .success(function(response , status){
        if(response=="true"){
            $.gritter.add({
                text: 'Successfully company contacts  is uploaded',
                class_name: 'gritter-success'
            });
        } else {
            $.gritter.add({
                text: 'Oopss..!! Something went wrong',
                class_name: 'gritter-error'
            });
        }

            $scope.loadCollegeData();
    })
    .error(function(){
        $.gritter.add({
            text: 'Oopss..!! Something went wrong',
            class_name: 'gritter-error'
        });
    });

 ## IN ROUTE(NODEJS): ##
 router.post('/college/upload_company_contact',function(req,res){
 var exceltojson; 
    uploadcsv(req,res,function(err){
        if(err){
                console.log("error"+err);

        }

        if(!req.file){
            console.log("error 1 ");
            return;
        }
         if(req.file.originalname.split('.')
   [req.file.originalname.split('.').length-1] === 'xlsx'){
            exceltojson = xlsxtojson;
        } else {
            exceltojson = xlstojson;
        }
          try {

            exceltojson({
                input: req.file.path,
                output: null, 
                lowerCaseHeaders:true
            }, function(err,result){
                if(err) {

                } 

                var data = result;
                console.log(JSON.stringify(data)+"asdfasdfasdfsdf");

         for(var i=0;i<data.length;i++){

        var newuploadCompanyContact = new uploadCompanyContact();
        newuploadCompanyContact._id= objectID();
        newuploadCompanyContact.college_id=req.user.reference_id;
        newuploadCompanyContact.company_name=data[i].company_name;
        newuploadCompanyContact.company_email=data[i].company_email;
        newuploadCompanyContact.company_contact=data[i].company_contact;
        newuploadCompanyContact.company_address=data[i].company_address;
        newuploadCompanyContact.company_city=data[i].company_city;
        newuploadCompanyContact.company_country=data[i].company_country;

     newuploadCompanyContact.contact_personname=data[i].contact_personname;

   newuploadCompanyContact.contact_personemail=data[i].contact_personemail;


  newuploadCompanyContact.contact_personmobile=data[i].contact_personmobile;


    newuploadCompanyContact.save(function(err,uploadcompany){
    if(err) {console.log("sorry data not inserted 
   :"+err);res.json("false");}
    if(uploadcompany){console.log("data inserted sucessfully : 
 "+uploadcompany);res.json("true");}
     });
    } 

            });
        } catch (e){
           console.log("catchhhhh");
        }

   })
   })

   ## IN MODEL(MONGODB) ##
   var mongoose = require('mongoose');
    var Schema = mongoose.Schema;

   var CollegeCompanySchema = new Schema({
_id: { type: String, unique: true, required: true },
college_id: {type: String},
company_name:{type:String,default:''},
company_email:{type:String,default:''},
company_contact:{type:String,default:''},
company_address:{type:String,default:''},
company_city:{type:String,default:''},
company_country:{type:String,default:''},
contact_personname:{type:String,default:''},
contact_personemail:{type:String,default:''},
contact_personmobile:{type:String,default:''},

});

var collectionName = 'college-company';
var CollegeCompany = module.exports = mongoose.model('CollegeCompany', 
CollegeCompanySchema, collectionName);
module.exports = CollegeCompany;

如何使用angularjs上传文件（.xls）？

2 个答案: