加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

图像处理 – 如何在Angular JS中更改src后刷新图像

发布时间:2020-12-17 06:52:37 所属栏目:安全 来源:网络整理
导读:我想选择一个文件并加载角度js. 一切都很好,图像不会重新解决的唯一问题.我可以看到一切正常,因为当我用angular.js在我的页面上切换菜单时,图像已经刷新了. 这是我的代码: div ng-controller="TopMenuCtrl" button class="btn" ng-click="isCollapsed = !is
我想选择一个文件并加载角度js.

一切都很好,图像不会重新解决的唯一问题.我可以看到一切正常,因为当我用angular.js在我的页面上切换菜单时,图像已经刷新了.

这是我的代码:

<div ng-controller="TopMenuCtrl">
        <button class="btn" ng-click="isCollapsed = !isCollapsed">Toggle collapse</button>
        <input ng-model="photo"
           onchange="angular.element(this).scope().file_changed(this)"
           type="file" accept="image/*" multiple />
            <output id="list"></output>
            <img ng-src="{{imageSource}}">
    </div>

和Angular js脚本:

$scope.file_changed = function(element) {
          var files = element.files; // FileList object
          // Loop through the FileList and render image files as thumbnails.
          for (var i = 0,photofile; photofile = files[i]; i++) { 

             // var photofile = element.files[0];
              var reader = new FileReader();
              reader.onload = (function(theFile) {
                    return function(e) {

                    $scope.imageSource= e.target.result;

                    };
                  })(photofile);

              reader.readAsDataURL(photofile);
            };

  }

解决方法

在onLoad函数中手动更新$scope.imageSource时,必须调用 Scope.$apply,因为Angular无法猜测何时进行此更改.

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读