动态改变 1 帧轮播中显示的幻灯片数量
Dynamically change number of slides displayed in 1 frame of carousel
我是 AngularJS 的新手。现在我有一个可重复使用的旋转木马小部件,我修改它以在一帧中显示 2 张幻灯片(我将我的旋转木马作为指令,所以我可以在任何地方使用它)。我使用的是angular-ui-bootstrap中的轮播组件,我按照post中解释的方式修改了它。
但是,我打算修改我当前的轮播小部件以接受一个数字,该数字将确定在 1 帧中显示多少张幻灯片,并动态更改其显示。
比如传3,则1帧显示3张幻灯片。
我的 1 帧 2 幻灯片轮播小部件的方式非常静态(1 帧中显示的幻灯片数量已在其 HTML 中定义)。是否有可能做到这一点?非常感谢任何帮助!谢谢
不需要修改angular-ui-bootstrap轮播,只需要在轮播里面显示一行两三列即可。
这是我对原始 angular-ui-bootstrap carousel plunkr 的叉子:
http://plnkr.co/edit/F2h3gIQKzpkjymZDgrK6
简短版本是:
<slide ng-repeat="slide in slides" active="slide.active">
<div class="row">
<div class="col-xs-6">
... first cell
</div>
</div>
<div class="row">
<div class="col-xs-6">
... second cell
</div>
</div>
</slide>
然后您可以创建自己的模板指令,计算要显示的列数(2 = col-xs-6, 3 = col-xs-4, ...)并呈现以上部分带有适当的列 类。
我是 AngularJS 的新手。现在我有一个可重复使用的旋转木马小部件,我修改它以在一帧中显示 2 张幻灯片(我将我的旋转木马作为指令,所以我可以在任何地方使用它)。我使用的是angular-ui-bootstrap中的轮播组件,我按照post中解释的方式修改了它。
但是,我打算修改我当前的轮播小部件以接受一个数字,该数字将确定在 1 帧中显示多少张幻灯片,并动态更改其显示。
比如传3,则1帧显示3张幻灯片。
我的 1 帧 2 幻灯片轮播小部件的方式非常静态(1 帧中显示的幻灯片数量已在其 HTML 中定义)。是否有可能做到这一点?非常感谢任何帮助!谢谢
不需要修改angular-ui-bootstrap轮播,只需要在轮播里面显示一行两三列即可。
这是我对原始 angular-ui-bootstrap carousel plunkr 的叉子:
http://plnkr.co/edit/F2h3gIQKzpkjymZDgrK6
简短版本是:
<slide ng-repeat="slide in slides" active="slide.active">
<div class="row">
<div class="col-xs-6">
... first cell
</div>
</div>
<div class="row">
<div class="col-xs-6">
... second cell
</div>
</div>
</slide>
然后您可以创建自己的模板指令,计算要显示的列数(2 = col-xs-6, 3 = col-xs-4, ...)并呈现以上部分带有适当的列 类。