Question

我有一个无序列表中的消息列表。我想给列表一个百分比高度并让它可以滚动。我尝试在ul中添加一个height属性，但它没有做任何事情。
JSFiddle：http://jsfiddle.net/3hq9ay42/1/
查看

<div ng-controller="MyCtrl">
    <h1>Chat</h1>
        <ul class="list-unstyled">
        <!-- List all messages -->
        <li class="col-xs-12 col-md-offset-4 col-md-4 chat-message" ng-repeat="message in chat_messages">
                <span ng-bind="message"></span>
            </div>
        </li>
    </ul>
</div>

控制器

var myApp = angular.module('myApp',[]);

function MyCtrl($scope) {

    $scope.chat_messages = ['a','b','c','a','b','c','a','b','c','a','b','c','a','b','c'];
}

Answer 1

使用 CSS 将高度设置为您想要的任何值，但它必须短于列表默认高度，否则您将无法看到滚动条。

ul.list-unstyled {
    height: 100px;
    overflow-y: auto;
}

如何使无序列表（ul）内的ng-repeat内容可滚动

1 个答案: