angularjs上傳
A. AngularJS $http 在本機能請求成功並獲取到json數據，但程序上傳至伺服器就獲取不到了，是什麼原因呢
LZ你的url請求，附上'/'看看
B. angularjs 上傳excel文件 是使用formdata嗎
這是
Struts2
自動幫你封裝的，你只需要寫好File的名字與前台對應就可以了，多個文件上傳的話Struts也是有文件數組可以完成的，設置好getset方法即可
C. angularjs使用$http post上傳文件的時候，怎樣獲取文件上傳的進度
angular在1.5.5以上的版本中,在$http中也加入了eventHandler和uploadEventHandlers等方法，所以可以直接這樣寫：
$http({
method: 'POST',
url: url,
eventHandlers: {
progress: function(c) {
console.log('Progress -> ' + c);
console.log(c);
}
},
uploadEventHandlers: {
progress: function(e) {
console.log('UploadProgress -> ' + e);
console.log(e);
}
},
data: uploadData,
}).success(function(data) {
console.log(data);
}).error(function(data, status) {
console.log(data);
});
最後，也可以用比較成熟的組件去解決，推薦angular-file-upload
D. angularjs結合nodejs實現文件的上傳怎麼弄
下面就用「multiparty」實現一個版本。
1.使用express（版本是4.11.x）創建一個項目，採用默認的jade作為模版引擎。
2.在項目目錄中，通過npm install multiparty進行安裝必要組件。
3.修改views/index.jade，如下做一個簡單的用於文件上傳的form。
1 extends layout
2
3 block content
4 form(method='post', action='/file/uploading', enctype='multipart/form-data')
5 input(name='inputFile', type='file', multiple='mutiple')
6 input(name='btnUp', type='submit',value='上傳')
4.修改routes/index.js，實現上傳頁面和上傳響應的後台代碼。
1 var express = require('express');
2 var router = express.Router();
3 var multiparty = require('multiparty');
4 var util = require('util');
5 var fs = require('fs');
6
7 /* 上傳頁面 */
8 router.get('/', function(req, res, next) {
9 res.render('index', { title: 'Express' });
10 });
11
12 /* 上傳*/
13 router.post('/file/uploading', function(req, res, next){
14 //生成multiparty對象，並配置上傳目標路徑
15 var form = new multiparty.Form({uploadDir: './public/files/'});
16 //上傳完成後處理
17 form.parse(req, function(err, fields, files) {
18 var filesTmp = JSON.stringify(files,null,2);
19
20 if(err){
21 console.log('parse error: ' + err);
22 } else {
23 console.log('parse files: ' + filesTmp);
24 var inputFile = files.inputFile[0];
25 var uploadedPath = inputFile.path;
26 var dstPath = './public/files/' + inputFile.originalFilename;
27 //重命名為真實文件名
28 fs.rename(uploadedPath, dstPath, function(err) {
29 if(err){
30 console.log('rename error: ' + err);
31 } else {
32 console.log('rename ok');
33 }
34 });
35 }
36
37 res.writeHead(200, {'content-type': 'text/plain;charset=utf-8'});
38 res.write('received upload:\n\n');
39 res.end(util.inspect({fields: fields, files: filesTmp}));
40 });
41 });
42
43 mole.exports = router;
完成。
「multiparty」的用法詳見：
www.npmjs.com/package/multiparty
github.com/andrewrk/node-multiparty
E. Angular中文社區angular 怎麼上傳文件
上傳可以使用多種插件上傳，如果要用jQuery，請參考 jQuery File Upload Demo AngularJS Requirements jQuery v. 1.6+ jQuery UI widget factory v. 1.9+ (included) jQuery Iframe Transport plugin (included) javaScript Templates engine v. 2.2.1+ (optional) JavaScript Load Image function v. 1.7.3+ (optional) JavaScript Canvas to Blob function v. 2.0.6+ (optional) Bootstrap CSS Toolkit v. 2.3+ (optional)
F. angularjs上傳文件怎麼設置$http為multipart/form-data
前言：很久沒更新博客，最近公司pc端技術選型用angular,這幾天就趕鴨子上架，硬著頭皮直接上手angular。其中有許多小坑陸陸續續踩起走。今天就遇到一個比較常見的問題：圖片上傳。 主題：圖片上傳伺服器，然後通過伺服器傳阿里雲。 不廢話了直接貼前端代碼： $http({ method: 『POST『, url: 『/wechatapp/User/setAvatar『, data: data, headers: { 『Content-Type『: undefined }, transformRequest: function(data) { var formData = new FormData(); formData.append(『avatar_data『, data.adata); formData.append(『avatar_file『, data.file); return formData; }, data: { adata: scope.avatar_data, file: scope.avatar_file } }).success(function(d) { //請求成功 cb(d); }).error(function(err, status) { console.log(err); cb(err); }); 其實沒神馬難點，主要是取消post默認的Content-Type,然後已FormData的方式上傳。一般ajax上傳文件都是以FormData方式傳。 以上就是本文給大家介紹Angular Js文件上傳之form-data，希望大家喜歡。
G. angularjs怎麼通過ajax上傳文件
ngularJS提供$http控制，可以作為一項服務從伺服器讀取數據。伺服器可以使一個資料庫調用來獲取記錄。 AngularJS需要JSON格式的數據。一旦數據准備好，$http可以用以下面的方式從伺服器得到數據。
function studentController($scope,$http) {
var url="data.txt";
$http.get(url).success( function(response) {
$scope.students = response;
});
}
在這里，data.txt中包含的學生記錄。 $http服務使Ajax調用和設置針對其學生的屬性。 「學生」模型可以用來用來繪制 HTML 表格。
例子
data.txt[
{
"Name" : "Mahesh Parashar",
"RollNo" : 101,
"Percentage" : "80%"
},
{
"Name" : "Dinkar Kad",
"RollNo" : 201,
"Percentage" : "70%"
},
{
"Name" : "Robert",
"RollNo" : 191,
"Percentage" : "75%"
},
{
"Name" : "Julian Joe",
"RollNo" : 111,
"Percentage" : "77%"
}
]
testAngularJS.html<html>
<head>
<title>Angular JS Includes</title>
<style>
table, th , td {
border: 1px solid grey;
border-collapse: collapse;
padding: 5px;
}
table tr:nth-child(odd) {
background-color: #f2f2f2;
}
table tr:nth-child(even) {
background-color: #ffffff;
}
</style>
</head>
<body>
<h2>AngularJS Sample Application</h2>
<div ng-app="" ng-controller="studentController">
<table>
<tr>
<th>Name</th>
<th>Roll No</th>
<th>Percentage</th>
</tr>
<tr ng-repeat="student in students">
<td>{{ student.Name }}</td>
<td>{{ student.RollNo }}</td>
<td>{{ student.Percentage }}</td>
</tr>
</table>
</div>
<script>
function studentController($scope,$http) {
var url="data.txt";
$http.get(url).success( function(response) {
$scope.students = response;
});
}
</script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script>
</body>
</html>
輸出
要運行這個例子，需要部署textAngularJS.html，data.txt到一個網路伺服器。使用URL在Web瀏覽器中打開textAngularJS.html請求伺服器。看到結果如下：
H. angularjs 上傳文件java 怎麼接收
首先java文件裡面 你User aUser = new User();你雖然new了這個實體，但是你並沒有給這個實體賦值，new出來的實體裡面的所有屬性都是null的。所以你輸出再回是null。然後是jsp文件你輸出的是null說明你的response.userName值就是null，
I. AngularJS中文社區angular 怎麼上傳文件
利用angular-file-upload組件就可以了。
angular-file-upload 是一個基於HTML5技術的文件上傳輕量級 AngularJS指令（directive），當瀏覽器不支持時轉為採用 FileAPI polyfill技術實現(基於Flash)。
參考:
//inject angular file upload directives and service.angular.mole('myApp', ['angularFileUpload']);var MyCtrl = [ '$scope', '$upload', function($scope, $upload) {
$scope.onFileSelect = function($files) { //$files: an array of files selected, each file has name, size, and type.
for (var i = 0; i < $files.length; i++) { var file = $files[i];
$scope.upload = $upload.upload({
url: 'server/upload/url', //upload.php script, node.js route, or servlet url
//method: 'POST' or 'PUT',
//headers: {'header-key': 'header-value'},
//withCredentials: true,
data: {myObj: $scope.myModelObj},
file: file, // or list of files ($files) for html5 only
//fileName: 'doc.jpg' or ['1.jpg', '2.jpg', ...] // to modify the name of the file(s)
// customize file formData name ('Content-Disposition'), server side file variable name.
//fileFormDataName: myFile, //or a list of names for multiple files (html5). Default is 'file'
// customize how data is added to formData. See #40#issuecomment-28612000 for sample code
//formDataAppender: function(formData, key, val){}
}).progress(function(evt) { console.log('percent: ' + parseInt(100.0 * evt.loaded / evt.total));
}).success(function(data, status, headers, config) { // file is uploaded successfully
console.log(data);
}); //.error(...)
//.then(success, error, progress);
// access or attach event listeners to the underlying XMLHttpRequest.
//.xhr(function(xhr){xhr.upload.addEventListener(...)})
} /* alternative way of uploading, send the file binary with the file's content-type. Could be used to upload files to CouchDB, imgur, etc... html5 FileReader is needed. It could also be used to monitor the progress of a normal http post/put request with large data*/
// $scope.upload = $upload.http({...}) see 88#issuecomment-31366487 for sample code.
};
}];
html:
<!-- shim is needed to support upload progress/abort for HTML5 and non-HTML5 FormData browsers.--><!-- angular-file-upload-html5-shim.js could be used instead of angular-file-upload-shim if your app targets HTML5 browsers only (not IE8-9) --><!-- Note: shim.js MUST BE PLACED BEFORE angular.js and angular-file-upload.js AFTER angular.js--><script src="angular-file-upload-shim.min.js"></script>
<script src="angular.min.js"></script>
<script src="angular-file-upload.min.js"></script>
<div ng-controller="MyCtrl">
<input type="text" ng-model="myModelObj">
<input type="file" ng-file-select="onFileSelect($files)">
<input type="file" ng-file-select="onFileSelect($files)" multiple accept="image/*">
<div class="button" ng-file-select="onFileSelect($files)" data-multiple="true"></div>
<div ng-file-drop="onFileSelect($files)" ng-file-drag-over-class="optional-css-class-name-or-function"
ng-show="dropSupported">drop files here</div>
<div ng-file-drop-available="dropSupported=true"
ng-show="!dropSupported">HTML5 Drop File is not supported!</div>
<button ng-click="upload.abort()">Cancel Upload</button>
</div>
J. angularjs插件怎麼使用
查看webstorm的setting里的plugin里是否有angular的庫，
如果有angular的庫，
且把angular的文件引入了本地，
且路徑是純文件路徑【不是 tp自帶的__PUBLIC__】，
且寫的時候沒提示，
那麼，打開你的plugin，將angular庫右側的激活給取消，restart一次之後，
再次把angular庫右側的激活給勾選，restart一次就可以使用了。