黑马程序员技术交流社区

标题: 【郑州校区】Java之品优购课程讲义_day08（2） [打印本页]

---

作者: 谷粒姐姐    时间: 2018-9-3 14:59
标题: 【郑州校区】Java之品优购课程讲义_day08（2）

2.1 广告管理

2.1.1 广告图片上传

将 pinyougou-shop-web 的以下资源拷贝到 pinyougou-manager-web

（1） UploadController.java

（2） uploadService.js

（3） application.properties

（4） fdfs_client.conf

在 pinyougou-manager-web 的 springmvc.xml 中添加配置

[AppleScript] 纯文本查看 复制代码

<!-- 配置多媒体解析器 -->



<bean  id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">

<property  name="defaultEncoding"  value="UTF-8"></property>



<!-- 设定文件上传的最大值 5MB，5*1024*1024 -->



<property  name="maxUploadSize"  value="5242880"></property>



</bean>

[AppleScript] 纯文本查看 复制代码

在 contentController.js 引入 uploadService

[AppleScript] 纯文本查看 复制代码

//控制层



app.controller('contentController'  ,function($scope,$controller        ,contentService,u ploadService){

在 content.html 引 入 JS

[AppleScript] 纯文本查看 复制代码

<script  type="text/javascript"  src="../js/service/uploadService.js">    </script>

在 contentController.js 编写代码

[AppleScript] 纯文本查看 复制代码

//上传广告图



$scope.uploadFile=function(){ uploadService.uploadFile().success(

function(response){ if(response.success){

$scope.entity.pic=response.message;



}else{



alert("上传失败！");



}



}



).error(



function(){



alert("上传出错！");



}



);



}

修改 content.html 实现上传功能

[AppleScript] 纯文本查看 复制代码

<tr>

<td>图片</td>



<td>



<input  type="file"  id="file">



<button  ng-click="uploadFile()">上传</button>



<img  alt=""  src="{{entity.pic}}"  height="100px"  width="200px">



</td>



</tr>

列表中显示图片

[AppleScript] 纯文本查看 复制代码

<img  alt=""  src="{{entity.pic}}"  height="50px"  width="100px">

---

欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/)

黑马程序员IT技术论坛 X3.2