通过AngularJS加载时，动画gif在Firefox中无法播放

Animated GIFs not playing in Firefox when loaded via AngularJS

本文关键字：Firefox 播放 gif 加载 AngularJS 动画通过更新时间：2023-09-26

我是Angular 1的初学者。我的控制器中有一个函数，它根据HTML表单中的一些参数生成指向各种动画GIF文件的url。然后我有一个img标签，应该显示GIF文件，像这样:

<img alt="preview" src="{{ctrl.previewURL()}}"/>

基本上，它工作。当我更改输入字段中的值时，图像也会相应地更新。然而，在以这种方式加载第三张图片后，gif停止播放动画(尽管正确的文件仍在加载中)，只显示一帧。无论我尝试以什么顺序加载它们，都会发生这种情况，所以这不是文件本身的问题。

有趣的是，这个问题似乎只出现在Firefox中(我使用的是版本48)。这一切在Microsoft Edge上都能完美地运行。我还没有机会尝试其他浏览器。

是否有一种方法可以让这个在Firefox中工作?或者在Angular中有更好的实践吗?

用ng-src代替src

浏览器一开始看到src为"{{ctrl.previewURL()}}"，直到angular开始工作，所以使用ng-src，图像将只加载angular。

代码:

<img alt="preview" ng-src="{{ctrl.previewURL()}}"/>