修改

Question

我正在使用jquery wheelzoom进行图像缩放功能。当我在角度转发器中使用图像时，它没有角度但工作正常。

Answer 1

修改

我终于通过一个指令来完成它。

说明：这是一个时间问题。当您在控制器内调用document.querySelectorAll时 - 当时只有一个图像可用（在ng-repeat之外的图像）。然后ng-repeat运行并向DOM添加更多图像 - 但它们还没有通过wheelzoom调用。

我已添加此指令，该指令可直接访问DOM元素本身并在其上调用wheelzoom。

app.directive('bsWheelzoom', function() {
  return {
    link: function(scope, elem, attrs) {
      wheelzoom(elem[0]);
    }
  }
})

HTML中的用法是

<div data-ng-repeat="d in data" style="width: 300px">
      <img class="imgInsideOfAngular" ng-src="{{d.img}}" alt="{{d.title}}" width="100%" bs-wheelzoom/>
    </div>

Workin Plnkr

http://plnkr.co/edit/ZjKfqKHGmCvP3LLxH0eg?p=preview

OLD

由于您的wheelzoom()电话不在角度世界范围内，因此您需要致电$scope.$apply()。

角度文档声明：

$ apply（）用于从角度框架外部以角度执行表达式。（例如，来自浏览器DOM事件，setTimeout，XHR或第三方库）。因为我们正在调用角度框架，所以我们需要执行异常处理的适当范围生命周期，执行监视

这可以解决您的问题：

$scope.$apply(function() {
    wheelzoom(document.querySelectorAll('img.aa'));
})

看到这个工作小提琴： http://jsfiddle.net/jeqtxp65/

jquery Image Wheelzoom with angularjs无法正常工作

1 个答案:

修改

Workin Plnkr

OLD