是否可以制作自定义上一个和下一个按钮 AngularJS UI 轮播?我也想有两个步骤的元素。对我来说,文档不是很清楚。
如果有人给我一个关于如何做的例子或方向,我会非常满意。
是否可以制作自定义上一个和下一个按钮 AngularJS UI 轮播?我也想有两个步骤的元素。对我来说,文档不是很清楚。
如果有人给我一个关于如何做的例子或方向,我会非常满意。
您不能轻易更改标记。这是来自 Github 的轮播模板
<div ng-mouseenter="pause()" ng-mouseleave="play()" class="carousel">
<ol class="carousel-indicators" ng-show="slides().length > 1">
<li ng-repeat="slide in slides()" ng-class="{active: isActive(slide)}" ng-click="select(slide)"></li>
</ol>
<div class="carousel-inner" ng-transclude></div>
<a ng-click="prev()" class="carousel-control left" ng-show="slides().length > 1">‹</a>
<a ng-click="next()" class="carousel-control right" ng-show="slides().length > 1">›</a>
</div>
当然,您可以覆盖 和 的.carousel-control.left
CSS .carousel-control.right
。如果你需要一个完整的元素替换,你可以做一些 DOM 操作。
您也可以尝试使用$templateCache
和完全覆盖模板玩游戏。中的资源名称$templateCache
是“'template/carousel/carousel.html'”
这是一个这样做的例子:
app.run(function($templateCache) {
$templateCache.put("template/carousel/carousel.html", "<div>REPLACED!!!</div>")
});
因此,您可以将模板修改为稍有不同。
警告这是特定于实现的。如果他们稍后更改实现,这种方法可能会失效。更喜欢 CSS 操作而不是模板替换。
我刚刚覆盖了轮播的默认样式
.glyphicon-chevron-right:before {
font-family: "FontAwesome";
content: "\f054";
}
.glyphicon-chevron-left:before {
font-family: "FontAwesome";
content: "\f053";
}