使 div 可滚动（当它有 ng-repeat 时）

Question

这是我的 html 代码：

 <div id="header_context" class="scroll">
    <div id="column_scroll" class="column" ng-repeat="column in columns track by column.name" ng-hide="column.name == 'date'" ng-click="column.visible = !column.visible">
        <div class="checkmark" ng-class="{'checked': column.visible}"></div>
        <div class="" ng-bind-html="column.title"></div>
    </div>
</div>

这是我的 css:

#column_scroll{
  overflow: scroll;
}
.scroll{
  overflow: scroll !important;
}

这是我在 .js 中的函数：

  $('#timeline_container #content .trips_header').on('contextmenu', function(e) {
    e.preventDefault();
    e.stopPropagation();
    hideContextMenu();
    $('#header_context').css({
        display: 'block',
        left: e.clientX,
        top: e.clientY,
        overflow:scroll
    });
    $('#header_context > div').click(function(evt) {
        evt.stopPropagation();
    });
});

这是我的检查员看到的： https://s3.amazonaws.com/uploads.hipchat.com/39260/829560/lPNa4qbS34P6dVE/upload.png

PS：我尝试从检查器溢出 - 滚动更改，但它仍然被阻止。我需要添加其他内容吗？

PPS：这是在 PC 上或检查器关闭时的样子： https://s3.amazonaws.com/uploads.hipchat.com/39260/829560/b37eCtrQIfgV4dt/upload.png 这是检查员在电脑上或笔记本电脑上的样子： https://s3.amazonaws.com/uploads.hipchat.com/39260/829560/qSquGYY8ZWulHZm/upload.png

如您所见，列表不适合，而且不可滚动。

Answer 1

我猜您遗漏了一些 html 代码。顺便说一句，如果您希望它可以滚动，div "header_context" 或将包含 ng-repeat 项的任何 div 必须具有高度或 max-height 属性定义，然后使它成为 "overflow-y:scroll;" 所以如果 children ng-repeat div 的高度超过 parent 高度，parent 变得可滚动。

使 div 可滚动（当它有 ng-repeat 时）

Make a div scrollable (when it has ng-repeat)

javascript

css

scroll

overflow

angularjs