javascript - 模型更改时angularjs图像src更改

Question

我正在服务器上旋转图像，我想知道如何在我的页面上显示图像变化？

我想我必须使用 $scope.$apply() 但每次我使用它时都会收到错误消息“正在进行摘要循环”

模板.html

 < img src='{{tempimagefilepath}}/> <!--image-->

Controller .js

 photoalbumServ.rotate_photo(post).then(function(data) {
  //after server modifies photo
    $scope.tempimagefilepath = $scope.baseurl + "user_images/user_43/temp/123-temp.jpg";
     $scope.$apply();
    });

谢谢

解决方法:

我的解决方案是更改范围值 {{tempimagefilepath}} 以便图像发生变化。这需要我在旋转图像时不断地重命名服务器上的文件。

Answer 1

两件事。首先，您应该使用 ng-src 而不是 src 来防止您的客户端在 Angular 计算表达式之前尝试加载图像。

其次，您向 $apply() 传递一个函数回调，它会进行必要的范围更改:

photoalbumServ.rotate_photo(post).then(function(data) {
    //after server modifies photo
    $scope.$apply(function() {
        $scope.tempimagefilepath = $scope.baseurl + "user_images/user_43/temp/123-temp.jpg"; 
    });
});