如何在angularjs中使用数据图像和数据缩放图像属性

我需要将ElevateToom图像滑块添加到我的角度应用程序中。下面是我的html代码

<img id="zoom_03"
 ng-src='{{galaryImages[0].w320}}'
 data-zoom-image='{{galaryImages[0].original}}'/>

这里

{{galaryImages[0]。原始}

及

{{galaryImages[0].w320}

正在使用来自控制器的Ajax调用动态加载ng src正在成功运行。但由于我使用了数据缩放图像作为更大的图像，它在控制器获取结果之前执行，因为ElevateToom脚本工作不正常，因为缩放图像被分配给角度表达式，{{galaryImages[0]。original}}。解决这个问题的办法是什么？是否有任何方法可以将数据缩放图像等属性处理为角度处理ng src？或任何其他解决方案

---

谢谢

在不知道ElevateToom到底是什么的情况下，我建议你做两件事中的一件。第一个是创建一个自定义指令来处理这个问题。第二种是使用ng attr

使用ng attr，您可以执行以下操作

  ng-attr-ng-src='{{galaryImages[0].w320}}'
  ng-attr-data-zoom-image='{{galaryImages[0].original}}'

我不知道该怎么做，如果它只是对变量进行快照，那么您将不得不做其他事情。如果它是为angular构建的，并且绑定到变量，那么它应该可以工作

如果你想让它等待，你可以做一些类似于切换布尔值的事情

<img id="zoom_03" ng-if="isLoaded"

ng if将使其完全脱离dom，并通过将isLoaded设置为true，在重新启用时进行计算

---

注意：无论采用哪种方法，我仍然建议您将其引入angular指令，看起来这是一个jquery插件。最好的方法是将它放在指令中，并通过指令应用逻辑，或者找到一个已经为angular构建的逻辑。如果没有指令，您将发现在angular中使用jquery逻辑非常困难。例如，此插件可能在document.ready上启动，以查找自定义变量，在这种情况下，ng if无法工作。

您能否创建一个plunkr/fiddle来重现此问题？建议您为此创建一个指令。这与ElevateToom类似，

self.imageSrc=self.$elem.data（“缩放图像”）？self.$elem.data（“缩放图像”）：self.$elem.attr（“src”）我如何将其输入到角度指令中？
 .complete(function() {
   //apply your logic
   $scope.isLoaded = true;