UIB-карусельного имеет высоту 0

Question

Использование:

• angularjs 1.5.3
• щ-бутстраповские 1.3.2

Это мой шаблон:

<div id="content" class="center"> 
    <div id="title"> 
     <uib-carousel active="true" interval="5000" ng-if="slides && slides.length"> 
      <uib-slide ng-repeat="slide in slides track by slide.name"> 
       <img ng-src="{{ slide.image }}" /> 
       <div class="carousel-caption"> 
        <p>{{ slide.description }}</p> 
       </div> 
      </uib-slide> 
     </uib-carousel> 
    </div> 
</div> 

Где-то в мой код Я выполняю звонок (с рабочим сервисом, который я использовал много раз):

Index.controller('Index.Main', ['$scope', '$sce', 'MyService', function($scope, $sce, myService) { 
    $scope.slides = []; 
    myService.loadStuff($scope, ..., function(){ 
     console.log($scope.slides); 
    }, function(data, status) { 
     console.log('Could not retrieve stuff'); 
    }).update(); 
}]); 

который может быть детализирован следующим образом:

1. MyServices называет $http.get за кулисами.
2. Массив слайдов будет показан консолью при наличии успеха http. Сейчас это так.
3. Сообщение об ошибке будет отображаться консолью при наличии ошибки HTTP. Правильно, это не так.
4. И, наконец, изображения правильно прикреплены к dom. Я могу быть уверен в этом, потому что я могу проверить его в своем браузере. однако высота карусельного (и содержание высота) составляет 0.

Что мне не хватает? Как я могу это исправить?

Answer 1

С uibootstrap документ:

Как вы можете видеть, вы должны объявить высоту карусели в контейнере DIV

Answer 2

Я на самом деле забыл, чтобы правильно указать свойство индекса. Если нет индекса для сопоставления, то невозможно определить, какое изображение активно. Когда изображение не активно, контейнер имеет высоту 0