カスタムの前と次のボタン AngularJS UI カルーセルを作成することは可能ですか? また、ステップの 2 つの要素が必要です。私にとって、ドキュメントはあまり明確ではありません。
誰かがそれを行う方法の例や方向性を教えてくれたら、とてもうれしいです。
カスタムの前と次のボタン AngularJS UI カルーセルを作成することは可能ですか? また、ステップの 2 つの要素が必要です。私にとって、ドキュメントはあまり明確ではありません。
誰かがそれを行う方法の例や方向性を教えてくれたら、とてもうれしいです。
マークアップを簡単に変更することはできません。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 操作を優先します。