javascript - otro - ng model ejemplo
Carga de archivos de varias partes usando AngularJS y SpringMVC (2)
Soy nuevo en angularJS e intento cargar un archivo usando JS angular y Spring MVC, pero no puedo obtener la solución requerida y terminar con excepciones en JS Controller.
Debajo está el código, eche un vistazo y por favor ayúdenme. Gracias
ApplicationContext.xml
<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
<property name="maxUploadSize" value="10000000" /> <!-- setting maximum upload size -->
</bean>
JSP:
<div data-ng-controller=''QuestionController''>
<form name="createChapForm" data-ng-submit="submitQue();" enctype="multipart/form-data" class="form-horizontal">
<div class="form-group">
<label class="control-label col-sm-3">Select Class * :</label>
<div class="col-sm-8">
<div class="col-sm-6">
<select data-ng-model=''class_id'' data-ng-init=''getClasses();'' data-ng-change=''getSubjectsClasswise(class_id);'' class="form-control" required>
<option value="">--SELECT--</option>
<option data-ng-repeat=''c in clss'' value="{{ c.class_id}}">{{ c.class_name}}</option>
</select>
</div>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-3">Select Subject * :</label>
<div class="col-sm-8">
<div class="col-sm-6">
<select data-ng-model=''question.sid'' data-ng-change=''doGetChapters(question.sid);'' class="form-control" required>
<option value="">--SELECT--</option>
<option data-ng-repeat=''s in subsss'' value="{{ s.sid}}">{{ s.subject_name}}</option>
</select>
</div>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-3">Select Chapter :</label>
<div class="col-sm-8">
<div class="col-sm-6">
<select data-ng-model=''question.chap_id'' class="form-control" >
<option value="">ALL</option>
<option data-ng-repeat=''c in chapters'' value="{{ c.chap_id}}">{{ c.chap_name}}</option>
</select>
</div>
</div>
</div>
<div class="form-group">
<div class="control-label col-sm-2" >Question :</div>
<div class="col-sm-10 padding_0">
<textarea data-ng-model=''question.question_text'' rows="5" class="form-control " > </textarea>
<div class="right">
<div class="fileUpload btn btn-primary1 btn-sm">
<input type="file" data-ng-model="file" name="file" id="file" id="q_id" class="upload" />
</div>
</div>
</div>
</div>
</form>
</div>
Controlador AngularJS:
$scope.submitQue = function() {
console.log(''file is '' ); console.dir(file.files[0]);
var URL =appURL+''/adm/doAddQuestion.do'';
var fd = new FormData();
fd.append(''file'', file.files[0]);
fd.append(''questionBean'', angular.toJson($scope.question, true));
$http.post(URL, fd, {
transformRequest : angular.identity,
headers : {
''Content-Type'' : undefined
}
}).success(function() {
console.log(''success'');
}).error(function() {
console.log(''error'');
});
}
Controlador Java:
@RequestMapping(value = "/doAddQuestion.do", method = RequestMethod.POST, consumes = MediaType.MULTIPART_FORM_DATA_VALUE)
public @ResponseBody String saveUserDataAndFile(@RequestParam(value = "file") MultipartFile file, @RequestBody QuestionBean questionBean) {
System.out.println("output: "+questionBean.getQuestion_text());
// Im Still wotking on it
return "";
}
Excepciones:
Mar 08, 2017 7:46:46 PM org.springframework.web.servlet.mvc.support.DefaultHandlerExceptionResolver handleHttpMessageNotReadable
WARNING: Failed to read HTTP message: org.springframework.http.converter.HttpMessageNotReadableException: Could not read document: Unexpected character (''-'' (code 45)) in numeric value: expected digit (0-9) to follow minus sign, for valid numeric value
at [Source: java.io.PushbackInputStream@bc03e1; line: 1, column: 3]; nested exception is com.fasterxml.jackson.core.JsonParseException: Unexpected character (''-'' (code 45)) in numeric value: expected digit (0-9) to follow minus sign, for valid numeric value
at [Source: java.io.PushbackInputStream@bc03e1; line: 1, column: 3]
Mar 08, 2017 7:46:46 PM org.springframework.web.servlet.mvc.support.DefaultHandlerExceptionResolver logException
WARNING: Handler execution resulted in exception: Could not read document: Unexpected character (''-'' (code 45)) in numeric value: expected digit (0-9) to follow minus sign, for valid numeric value
at [Source: java.io.PushbackInputStream@bc03e1; line: 1, column: 3]; nested exception is com.fasterxml.jackson.core.JsonParseException: Unexpected character (''-'' (code 45)) in numeric value: expected digit (0-9) to follow minus sign, for valid numeric value
at [Source: java.io.PushbackInputStream@bc03e1; line: 1, column: 3]
actualice su asignación de solicitud con el siguiente código:
@RequestMapping(value = "/upload-file", method = RequestMethod.POST, consumes = MediaType.MULTIPART_FORM_DATA_VALUE)
Eliminará su excepción multiparte.
Agregue estos archivos .js
donde ha agregado archivos angular.js
angular-file-upload.js
, angular-file-upload-shim.js
, ng-file-upload.js
, ng-file-upload-shim.js
Puede descargar desde este enlace Archivo Angular para Subir.
A continuación, agregue ngFileUpload,''angularFileUpload''
en angular.module
consulte la línea siguiente.
angular.module(''formSubmit'', [ ''ngFileUpload'',
''angularFileUpload'', ''ui.router'' ]);
A continuación, agregue $upload
en su controlador angular de esta manera.
app.controller(''FormSubmitController'', function($scope, $http, $upload)
Use $upload.upload
lugar de $http.post
en su código angular.
$upload.upload({
url : ''doAddQuestion.do'',
file : yourFile,
data : $scope.questionBean,
method : ''POST''
});
Cambia tu controlador de primavera.
@RequestMapping(value = "/doAddQuestion.do", method = RequestMethod.POST, headers = ("content-type=multipart/*"))
public @ResponseBody String saveUserDataAndFile(@RequestParam("file") MultipartFile file, QuestionBean questionBean) {
System.out.println("output: "+questionBean.getQuestion_text());
// Im Still wotking on it
return "";
}