如何实现滑块显示图片和视频的想法。
如何通过不同数据类型的ng-repeat进行重复?
我有一个文件列表:
var scr = [
{src: 'img1.png', title: 'Pic 1'},
{src: 'img2.jpg', title: 'Pic 2'},
{src: 'vid1.mp4', title: 'Vid 1'},
{src: 'vid2.mp4', title: 'Vid 2'}
];
可以通过ng-repeate插入图像:
<div class="slide" ng-repeat="image in images" ng-show="image.visible">
<img src="./img/slides/{{image.src}}"/>
</div>
如何在此列表中插入视频?
如果有任何帮助,我将不胜感激。
答案 0 :(得分:0)
如果可以修改数据数组,
var scr = [
{src: 'img1.png', title: 'Pic 1', type: 'imge'},
{src: 'img2.jpg', title: 'Pic 2', type: 'imge'},
{src: 'vid1.mp4', title: 'Vid 1', type: 'video'},
{src: 'vid2.mp4', title: 'Vid 2', type: 'video'}
];
然后您可以使用ng-if
来确定要使用的元素
<div class="slide" ng-repeat="media in scr">
<img ng-if="media.type == 'image'" ng-src="./img/slides/{{media.src}}" />
<video ng-if="media.type == 'video'" ng-src="{{media.src}}"></video>
</div>
答案 1 :(得分:0)
ng-switch on="image"
然后将其与src或title
进行比较ng-switch-when="image.src == 'video'"
#.... render video object here
ng-switch-default
do some default behaviour of showing your image
抱歉错过了你的src中的类型,或者你可以拆分你的字符串并使用相同的:)你的选择