Question

您好我按照angular-ui enter link description here的教程进行操作。它现在工作正常，我想将它改为控制器，因为语法可以告诉我如何操作它，对于这个轮播和其他元素？

示例代码：

    app.controller('CarouselDemoCtrl', ['$scope',function ($scope) {
    that = this;
    that.myInterval = 5000;
    that.noWrapSlides = false;
    var slides = $scope.slides = [];


    that.addSlide = function() {
        var newWidth = 600 + slides.length + 1;
        slides.push({
            image: '//placekitten.com/' + newWidth + '/300',
            text: ['More','Extra','Lots of','Surplus'][slides.length % 4] + ' ' +
            ['Cats', 'Kittys', 'Felines', 'Cutes'][slides.length % 4]
        });
    };
    for (var i=0; i<4; i++) {
        that.addSlide();
    }
}]);

并在模板中：

<div ng-controller="CarouselDemoCtrl as carousel">
    <div style="height: 305px">
        <uib-carousel interval="myInterval" no-wrap="noWrapSlides">
            <uib-slide ng-repeat="slide in carousel.slides" active="slide.active">
                <img ng-src="{{slide.image}}" style="margin:auto;">
                <div class="carousel-caption">
                    <h4>Slide {{$index}}</h4>
                    <p>{{slide.text}}</p>
                </div>
            </uib-slide>
        </uib-carousel>
    </div>
</div>

Answer 1

您的var实例化中似乎也缺少that。你需要说var that = this;或者你将它添加到全局window对象 - 几乎肯定不是你想要的。另外，如果您不使用$scope，请不要注射它。

最后，we expose UibCarouselController使用controllerAs语法carousel，因此您可能想要选择其他名称。

Carousel angular-ui将控制器更改为语法

1 个答案: