javascript - 文件无法使用 PHP 和 angular.js 上传到文件夹

Question

我遇到了一个问题。我无法使用 Angular.js 和 PHP 将文件保存到本地文件夹中。我在下面解释我的代码。

<div class="input-group bmargindiv1 col-md-12">
    <span class="input-group-addon ndrftextwidth text-right" style="width:180px">Upload Image :</span>
    <input type="file"
           class="filestyle form-control"
           data-size="lg"
           name="uploadme"
           id="bannerimage"
           ngf-select
           ng-model="file"
           ngf-pattern="'image/*'"
           accept="image/*"
           ngf-max-size="20MB"
           ngf-min-height="100"
           ngf-resize="{width: 100, height: 100}"
           custom-on-change="uploadFile"
           required="required">
</div>

上面的代码表示我的文件输入字段。下面给出了 Controller 代码。

var today = $filter('date')(new Date(), 'yyyy-MM-dd HH:mm:ss');
var newpath = today + "_" + $scope.file.name;
var arrFile = {'name': newpath, 'size': $scope.file.size, 'type': $scope.file.type};
var productdata = $.param({
    'op': 'add',
    'catagory_id': $scope.catagory_name.value,
    'product_name': $scope.product_name,
    'status': $scope.product_status,
    'ucp': $scope.unit_cost_price,
    'usp': $scope.unit_sale_price,
    'quantity': $scope.quantity,
    'specification': $scope.specification,
    'discount': $scope.discount,
    'image': newpath,
    'file': arrFile
});
$http({
    method: 'POST',
    url: "php/productInfo.php",
    data: productdata,
    headers: {'Content-Type': 'application/x-www-form-urlencoded'}
}).then(function successCallback(response) {
}, function errorCallback(response) {
});

这里我还有其他表单数据和文件。

productInfo.php:

if ($_REQUEST["op"]=="add") {
    $name     = $_FILES['file']['name'];
    $tmpName  = $_FILES['file']['tmp_name'];
    move_uploaded_file($tmpName,'upload/'.$name);
}

这里我只提到了php文件的文件上传部分。我还在项目文件夹中上传了文件夹。但是我无法将文件保存在该文件夹中。请帮我解决这个问题。

Answer 1

 **IT WILL WORK FOR YOU**  


<form  role="form">  
div class='form-group'>
              <label class='control-label'>Image</label>
             <input class='form-control' type="file" name="mfile" file-model="getting.image" accept="image/*" resize-max-height="300" resize-max-width="250" resize-quality="0.7" required > 
              <span ng-show="imagerequired" class="help-block">{{imagerequired}}</span>  
</form>

服务:-

app.service('multipartForm', ['$http', function($http,$scope,usSpinnerService){
this.post = function(uploadUrl, data){
    var fd = new FormData();
    for(var key in data)
        fd.append(key, data[key]);
    $http.post(uploadUrl, fd, {
        transformRequest: angular.indentity,
        headers: { 'Content-Type': undefined }
    }).success(function(data){

        if(data.RESPONSE_STATUS == "1"){
           // this.responseMessage = "Question added successfully";
          alert("Mantar uploaded successfully...");
            window.location.reload();


            }
            else { 
                alert("Error in Upload Mantra"); 
                //$scope.responseMessage = "Error occur while adding question";

            }
    });
}
this.success = function()
{
    alert("success");
    var success = true;
}
   }]);

指令

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

Controller :

var uploadUrl = 'upload.php';
        multipartForm.post(uploadUrl, $scope.getting);

php:

 $target_dir = "uploads/".$_FILES['file']['name'];
        move_uploaded_file($_FILES["image"]["tmp_name"], $target_dir);