职位清单未显示

如何解决职位清单未显示

我将tiular与Angular.JS一起使用来创建智能电视应用。我想获得一个字幕列表以在我的视频应用程序上显示，但我不断收到此错误：“错误：限制列表的容器和模板视图应具有自己的大小，例如宽度和高度。”

在我的主要html上，我在这里有一个“设置”指令： <settings></settings>

使用settings.html在此处显示caph列表： <caph-list container-class="container" wrapper-class="setting-wrapper" items="item in subtitles"> <div class="item" focusable>{{item}}</div> </caph-list>

我已经在我的settings.html中尝试使用容器和包装器进行各种设置：

<div class="container">
    <div class="wrapper">
        <caph-list container-class="container" wrapper-class="setting-wrapper" items="item in 
subtitles">
<div class="item" focusable>{{item}}</div> 
        </caph-list>
    </div>
</div>

但是我仍然遇到相同的错误。

这是在容器和包装类上使用的CSS：

.container {
    width: 800px;
    height: 100px;
    background-color: red;
}
.setting-wrapper {
    width: 400px;
    height: 100px;
    left: 50px;
    background-color: green;
}
.item {
    width: 20px;
    height: 20px;
    background-color: blue;
    margin: 10px;
}

这是开头的字幕数组：

$scope.subtitles = ["1","2","3"]

选择视频后，此数组将更改为包含字幕信息的对象的数组。

解决方法

您的容器的宽度可能为0像素。尝试设置一个绝对值而不是百分比，即800像素而不是60％），并确保父元素的宽度和高度（不为0）。