刚接触angularjs在使用的过程中遇到这个问题

首先我们的图片地址是根据ID来获取的,所以用了指令来完成图片的绑定

.directive("cImg", ['appUrl', function (appUrl) {
return {
restrict: 'A',
link: function (scope, element, attrs) {
var url = appUrl+ "/GetImgUrl";
var para = { id: attrs.id};
scope.baseService.post(url, para, function (data) {
$(element).attr("src", data.d);
});
}
};
}])

  

 <img c-img id="{{id}}" width="200" height="120" alt="">

 

但是这样的话上传图片后如果不刷新页面的话图片地址是不会更新的,解决方法是用一个$scope变量来记录是否显示图片,这样在更新这个变量后就会刷新图片了

<img ng-if="IsShowImg" c-img id="{{id}}" width="200" height="120" alt="">

  

 function () {
var url = url+ "/up_load";
//上传之前设置为false 隐藏图片
$scope.IsShowImg=false;
$scope.baseService.post(url, {}, function (data) {
//上传成功后显示图片
$scope.IsShowImg = true;
});
}

  

angularjs图片上传后不刷新的解决办法的更多相关文章

  1. SpringBoot集成百度UEditor图片上传后直接访问404解决办法

    SpringBoot项目上传图片一般是上传至远程服务器存储,开发过程中可能会上传至当前项目的某个静态目录中,此时就会遇到这个问题,文件在上传之后直接访问并不能被访问到,必须重新加载项目. 首先分析一下 ...

  2. from表单文件上传后页面跳转解决办法

    from表单上传文件,路径跳转后,又不能转发回来. 本人的一个解决办法是.返回一段html代码,浏览器解析后后退一步,回到原来的页面并刷新. return "<html>< ...

  3. angularjs图片上传和预览 base64

    angularjs图片上传和预览 思路是从file中读取base64 Module.controller('controlName', ['$scope', '$http', function($sc ...

  4. 分离与继承的思想实现图片上传后的预览功能:ImageUploadView

    本文要介绍的是网页中常见的图片上传后直接在页面生成小图预览的实现思路,考虑到该功能有一定的适用性,于是把相关的逻辑封装成了一个ImageUploadView组件,实际使用效果可查看下一段的git效果图 ...

  5. 改变wordpress图片上传后的压缩质量

    WordPress 在图片上传后会默认压缩图片质量为原来的 90%,这样做的好处可以极大的加快页面的载入速度与缩小图片大小所占服务器空间. 如果希望 100% 原质量怎么办呢?如何禁止 WordPre ...

  6. django实现图片上传后自动修改尺寸并保存修改后的图到数据库和本地文件系统

    图片上传首先要是设置settings.py文件(与静态文件设置类似) MEDIA_ROOT = os.path.join(BASE_DIR,'media')MEDIA_URL = '/media/' ...

  7. js实现图片上传后即时预览

    //关于FileReader对象 http://blog.csdn.net/zk437092645/article/details/8745647 <!DOCTYPE html> < ...

  8. iOS图片上传后被旋转的问题

    最近用PHP做了一个图片合成程序,前端是通过HTML的file input选取自定图片,POST到php后台调整尺寸后与事先准备好的背景图进行合成. 通过测试发现,上传后的自定图片有的被旋转了,有的是 ...

  9. Android webview 上传文件不调用openFileChooser解决办法

    html页面带有图片上传功能,关于使用openFileChooser方法去选择图片,并且在onActivityResult方法里面设置返回的图片url文件路径,网上有很多,再次不再赘述. 实践中发现, ...

随机推荐

  1. ExecutorService 建立一个多线程的线程池的步骤

    ExecutorService 建立一个多线程的线程池的步骤: 线程池的作用: 线程池功能是限制在系统中运行的线程数. 依据系统的环境情况,能够自己主动或手动设置线程数量.达到执行的最佳效果:少了浪费 ...

  2. Linux常用命令3--如何设置IP地址?如何更改系统时间?

    Linux常用命令 系统状态监控 [1]ps:用于显示当前系统中运行的进程. 语法:ps [-option]:常用的参数有:-a;-u;-x;-e;-f. -a:显示所有进程: -u:显示所有用户: ...

  3. vs2005中的WebBrowser控件的简单应用

    原文:vs2005中的WebBrowser控件的简单应用 这个控件被封装了一下,和以前的调用方式稍有不同.事件还是那几个,变化不大.方法变了不少.从网上能查到的资料不多,贴出一些代码来作参考.看看这段 ...

  4. ssh ipv6

    从这里学来的.http://blog.mattandanne.org/2012/01/sftpscp-and-ipv6-link-local-addresses.html当采用ipv6的地址去连接另外 ...

  5. C# 程序自动批量生成 google maps 的KML文件

    原文:C# 程序自动批量生成 google maps 的KML文件 google maps 的 KML 文件可以用于静态的地图标注,在某些应用中,我们手上往往有成百上千个地址,我们需要把这些地址和描述 ...

  6. 纯CSS3打造七巧板

    原文:纯CSS3打造七巧板 最近项目上要制作一个七巧板,脑子里瞬间闪现,什么...七巧板不是小时候玩的吗... 七巧板的由来 先来个科普吧,是我在查资料过程中看到的,感觉很有意思. 宋朝有个叫黄伯思的 ...

  7. HEAP CORRUPTION DETECTED

    发生主要是由于这个问题给写入超出预分配的空间,注意检查越界情况 版权声明:本文博客原创文章,博客,未经同意,不得转载.

  8. 防止tab页重复的去请求服务端

    直接看图吧. 左边是企业树,右边是依据企业变化的一个tab页 实现功能:1.我们希望假设选中的企业不变,我们在切换旁边五个tab页的时候,仅仅是第一次进去的时候请求server端.以下来回切换tab页 ...

  9. jQuery EasyUI API - Base - Draggable [原创汉化官方API]

    最近在学习jQuery EasyUI,发现中文的文档好少,部分文档不错但它是鸟语的,为了大家也为了自己学习吧,汉化做一下笔记. 有没有说清楚的,或者翻译不正确的地方还请大家谅解指出.. 由于工作时间原 ...

  10. SQL Server 2014 新特性:IO资源调控

    谈谈我的微软特约稿:<SQL Server 2014 新特性:IO资源调控> 2014-07-01 10:19 by 听风吹雨, 570 阅读, 16 评论, 收藏, 收藏 一.本文所涉及 ...