一. angurlajs 相关

远程 jar 包 https://code.angularjs.org/angular-1.0.1.min.js

二. 正文

1. html 部分

  1. <!-- 需要引入的包 -->
    <script src="/angular/angular.js"></script>
  2. <script src="/angular-file-upload/ng-file-upload.js"></script>
  3.  
  4. <!-- html -->
  5. <div ng-app="upload"><!-- 自定义ng-app的值 -->
  6.   <div ng-controller="uploadController"><!-- 自定义ng-controller的值 -->
  7.     <div ngf-select="upload($file)"></div><!-- upload是允许自定义的方法名 -->
  8.   </div>
  9. </div>

2. js 部分

  1. // 'upload' 是上面自定义的ng-app
    var app = angular.module('upload', ['ngFileUpload']);
    // 'uploadController' 是上面自定义的ng-controller
  2. app.controller('uploadController',['$scope','Upload', function ($scope,Upload) {
  3.  
  4. // upload是上面允许自定义的方法名
  5. $scope.upload = function (file) {
  6. if (file == null) {
  7. return;
  8. }
  9. Upload.upload({
  10. url: url,
  11. data: {file: file}
  12. }).then(function (result) {
  13. console.log(result);
  14. }, function (resp) {
  15. //console.log('Error status: ' + resp.status);
  16. }, function (evt) {
  17. //var progressPercentage = parseInt(100.0 * evt.loaded / evt.total);
  18. //console.log('progress: ' + progressPercentage + '% ' + evt.config.data.file.name);
  19. });
  20. };
  21. }]);

angularjs上传图片插件使用的更多相关文章

  1. AngularJS常用插件与指令收集

    angularjs 组件列表 bindonce UI-Router Angular Tree angular-ngSanitize模块-$sanitize服务详解 使用 AngularJS 开发一个大 ...

  2. 如何写一个Js上传图片插件。

    项目里面需要一个上传图片的插件,找了半天没有找到满意的,算了 不找了,自己写一个吧,顺便复习一下js方面的知识.完成之后效果还不错,当然还要继续优化,源码在最后. 介绍一种常见的js插件的写法 ; ( ...

  3. angularJS 常用插件指令

    长时间没有登入博客园了,今天突然想了想,当初开这个的目的,其实就是为了记录你当下的一个状态和累计一些问题,所以记录这些还是很有意义,毕竟不是什么牛,靠脸又吃不饱的这个年代,需要留下一些东西给自己看也好 ...

  4. Typora-yes:typora最舒适的使用-优化主题+图床服务+自动上传图片插件

    转载注明出处:https://www.cnblogs.com/nreg/p/11992678.html,谢谢 开源项目下载:https://github.com/nreg/typora-yes 云盘: ...

  5. angularjs上传图片

    通过AngularJS实现图片上传及缩略图展示(读取文件内容) AngularJS图片上传功能的实现(读取文件内容) AngularJs实现Multipart/form-data 文件的上传(上传文件 ...

  6. jquery上传图片插件plupload

    官方网站:http://plupload.com/ jquery.plupload.queue插件,是上传图片组件很强大的插件.plupload 前端根据浏览器不同选择使用Html5. Gears, ...

  7. 三、angularjs上传图片

    上传图片需要引入插件ngFileUpload,使用bower安装方法: bower install ng-file-upload --save,安装后需要在命名app的名字js文件中注入,如下所示: ...

  8. 转AngularJS路由插件

    AngularJS学习笔记--002--Angular JS路由插件ui.router源码解析 标签: angular源码angularjs 2016-05-04 13:14 916人阅读 评论(0) ...

  9. angularjs之插件ngRoute和ngAnimate

    使用ngRoute和ngAnimate配合使用,可以实现页面切换的效果. 如果有使用过swiper,就知道这个效果是怎么样的. 代码: <!DOCTYPE html> <html l ...

随机推荐

  1. js求两个数的最大公约数

    1, lcm=function(m,n){//辗转相除法 求最大公约数 var u=+m,v=+n,t=v; while(v!=0){ t=u%v; u=v; v=t; } return u }2, ...

  2. Knockout js 绑定 radio 时,当绑定整形的时候,绑定不生效

    解决方案: 使用checkedValue和checked 组合,如下代码. <div><input type="radio" name="flavorG ...

  3. Git 添加自己分支 pull request

    1.找到项目地址 这里,我们可以找到项目地址,比如:https://github.com/*****/Cplusplus_Thread_Lib,然后点击页面右上角的 "fork"  ...

  4. 3.Thread中的静态方法

    1.currentThread() public class Thread14 extends Thread{ static { System.out.println("静态块的打印:&qu ...

  5. 利用StringBuffer向字符串特定的重复子字符串插入数据

    public class InsertDetail {    public void insertInvoiceDetail(StringBuffer sb, String Label, String ...

  6. scala占位符_的用法

    占位符的用途颇多,先介绍几种常用的用法 1.作为"通配符",类似Java中的*.如import scala.math._2.:_*作为一个整体,告诉编译器你希望将某个参数当作参数序 ...

  7. SQL语句的优化

    1.创建索引 表中数据经常需要用的哪些字段数据进行过滤,则添加该字段的索引,索引相当如一本书的目录,能加快查询数据的速度:同时在新建索引的时候,将需要查询的列,在包含性 列中新增上去,能减少查询语句的 ...

  8. sublime修改代码字体颜色

    1.首先知道你采用的是什么颜色主题在Preferences => color scheme查看,假设是Monokai2.查找该主题的脚本文件Preferences => Browse Pa ...

  9. java变量初始化

    java全局变量会自动初始化,但局部变量不会自动初始化.当我们新建一个对象的时候,java会申请一个区域存放类的数据,而成员变量就是类的数据,也是放在这个内存区域中,jvm申请内存时初始化.而方法中变 ...

  10. Java多线程--让主线程等待所有子线程执行完毕

    数据量很大百万条记录,因此考虑到要用多线程并发执行,在写的过程中又遇到问题,我想统计所有子进程执行完毕总共的耗时,在第一个子进程创建前记录当前时间用System.currentTimeMillis() ...