ng-class 或 ng-style 指令在 ui bootstrap 轮播中不起作用

Question

我正在使用 UI Bootstrap 轮播，需要在其中进行一些自定义，以便用户可以访问配置选项，例如文本颜色、导航 show/hide 等。 ..

为此，我使用了他们的旋转木马 html 模板并添加了一些 ng-class 用于显示 block/none 和其他一些 ng-style 但它们不起作用并且没有任何效果都一样。

如果我在写入旋转木马标记的页面上使用相同的内容，这些内容工作正常。

参考 plunker 复制问题

模板HTML

<div ng-mouseenter="pause()" ng-mouseleave="play()" class="carousel" ng-swipe-right="prev()" ng-swipe-left="next()">
    <div class="carousel-inner" ng-transclude></div>
    <a role="button" href class="left carousel-control" ng-click="prev()" ng-show="slides.length > 1" ng-class="{'dispNone': carousel.arrow}">
        <span aria-hidden="true" class="glyphicon glyphicon-chevron-left"></span>
        <span class="sr-only">previous</span>
    </a>
    <a role="button" href class="right carousel-control" ng-click="next()" ng-show="slides.length > 1" ng-class="{'dispNone': carousel.arrow}">
        <span aria-hidden="true" class="glyphicon glyphicon-chevron-right"></span>
        <span class="sr-only">next</span>
    </a>
    <ol class="carousel-indicators" ng-show="slides.length > 1">
        <li ng-repeat="slide in slides | orderBy:indexOfSlide track by $index" ng-class="{ active: isActive(slide) }" ng-click="select(slide)">
            <span class="sr-only">slide {{ $index + 1 }} of {{ slides.length }}<span ng-if="isActive(slide)">, currently active</span></span>
        </li>
    </ol>
</div>

Answer 1

您可以在模板中使用 $parent，因为您有不同的范围。喜欢

$parent.navArrow

ng-class 或 ng-style 指令在 ui bootstrap 轮播中不起作用

ng-class or ng-style directive not working in ui bootstrap carousel

angularjs

angularjs-directive

angular-ui-bootstrap