html - Bootstrap ui 轮播为空

Question

<carousel interval="myInterval">
    <slide ng-repeat="slide in behaviorDataset track by $index" ng-swipe-right="showPrev()" ng-swipe-left="showNext()">
        <img ng-src="slide.image">
    </slide>
</carousel>

var changeImagelist = function (imageList) {
    $scope.$apply(function () {
        $scope.behaviorDataset = imageList;
    });
}

在上面，您可以找到我的旋转木马的一些代码。但是奇怪的事情发生了。我单击一个按钮，然后将出现一个带有此轮播的模式框。但是每次我点击按钮通常它应该是其他图像。

第一次它工作正常，第二次我打开带有轮播的模态框，但您看不到任何数据。但是当您使用谷歌浏览器检查代码时，您会看到应该在轮播中可见的图像的源代码。

我该如何解决这个问题？

-----更新-----

我在这里用 plunker 做了一些例子，你可以看到我遇到的问题。首先你需要点击点击我。然后你会看到带有一些项目的轮播。然后关闭模态框。并切换图像并再次单击单击我。然后你会看到轮播是空的。

http://plnkr.co/edit/YASfl9nF0cxqlytFjjI0?p=preview

Answer 1

在你的 Controller 中定义一个函数来获取图片并在 HTML 中使用它

Controller :

$scope.getSlides = function(){
    return $scope.behaviorDataset;
}

在你的 ng-repeat 中:

<slide ng-repeat="slide in getSlides() track by $index" ng-swipe-right="showPrev()" ng-swipe-left="showNext()">
    <img ng-src="slide.image">
</slide>