Angular的ng-src保留了之前的模型,直到它在内部预加载图像.我在每个页面上为横幅使用不同的图像,当我切换路径时,我改变主视图,保持标题视图不变,只是在我拥有它时更改bannerUrl模型.
这导致在加载新的横幅图像时看到之前的横幅图像.
我很惊讶它还没有指令,但我想在尝试构建之前进行讨论.
我想要做的是我认为自定义属性上有横幅模型.喜欢:
<img preload-src="{{bannerUrl}}" ng-src="{{preloadedUrl}}">
Run Code Online (Sandbox Code Playgroud)
然后$ scope.watch for bannerUrl更改,并且一改变,首先用loader spinner替换ng-src,然后创建temproary img dom元素,从preload-src预加载图像,然后将其分配到preloadUrl.
例如,需要考虑如何为画廊处理多个图像.
有人有任何意见吗?或者有人可以指出我现有的代码?
我已经在github上看到了使用背景图像的现有代码 - 但这对我不起作用,因为我需要动态高度/宽度,因为我的应用程序是响应式的,我不能用背景图像来做.
谢谢