In an attempt to incorporate a file upload feature using ng-file-upload, I stumbled upon an example here that served as my reference.
Despite everything appearing to function correctly, the issue arises when attempting to upload the file to my local webserver, resulting in an
Error Code 405 (Method not allowed)The following snippet showcases part of my markup:
<div class="block form-group">
<label for="photo">Photos:</label>
<input type="file" ngf-select ng-model="addCourtCtrl.picFile" name="file"
accept="image/*" ngf-max-size="2MB" required
ngf-model-invalid="errorFile">
<img ng-show="addRegisterForm.file.$valid" ngf-thumbnail="picFile" class="thumb">
<button ng-click="addCourtCtrl.picFile = null" ng-show="addCourtCtrl.picFile">Remove</button>
<br>
<button ng-click="addCourtCtrl.uploadPic(addCourtCtrl.picFile)">
Upload
</button>
<span class="progress" ng-show="addCourtCtrl.picFile.progress >= 0">
<div style="width:{{addCourtCtrl.picFile.progress}}%"
ng-bind="addCourtCtrl.picFile.progress + '%'"></div>
</span>
<span ng-show="picFile.result">Upload Successful</span>
<span class="err" ng-show="errorMsg">{{errorMsg}}</span>
</div>
In addition, below is how I have defined my upload function:
this.uploadPic = function (file) {
file.upload = Upload.upload({
url: '/www/images/uploads/courts',
data: { username: __this.username, file: file },
});
file.upload.then(function (response) {
$timeout(function () {
file.result = response.data;
});
}, function (response) {
alert('Upload Failed');
if (response.status > 0)
__this.errorMsg = response.status + ': ' + response.data;
}, function (evt) {
// Math.min is to fix IE which reports 200% sometimes
file.progress = Math.min(100, parseInt(100.0 * evt.loaded / evt.total));
});
}
My application utilizes gulp's webserver for execution, and interestingly, no errors are encountered when employing the same upload URL as used in the example.
While seeking solutions related to this matter, I find the responses quite complex given my novice status in Angular.
Any assistance provided would be greatly appreciated. Thank you in advance.