我正在尝试在我的项目中使用ng-scrollbar来实现滚动条但不知何故它对我不起作用。我在index.html中包含了以下文件:
<link rel="stylesheet" href="bower_components/ng-scrollbar/dist/ng-scrollbar.css" />
<script src="bower_components/ng-scrollbar/dist/ng-scrollbar.js"></script>
另外,我的玉模板看起来像这样:
<li id="notification-button" class="dropdown notifications-menu"><a href="#notifications" data-toggle="dropdown" aria-expanded="false" class="dropdown-toggle"><i class="fa fa-bell-o"></i><span class="label label-warning">{{user.notifications.count}}</span></a>
<ul class="dropdown-menu">
<li class="header">{{user.notifications.count}} notifications.</li>
<li>
<div ng-scrollbar="ng-scrollbar">
<ul style="overflow: hidden; width: 100%; height: auto;" class="menu">
<li ng-repeat="notification in user.notifications"><a href="#"><i class="fa fa-users text-aqua"></i>{{notification.text}}</a></li>
</ul>
</div>
</li>
<li class="footter"><a href="#">View all</a></li>
</ul>
</li>
我对应这个块的css如下:
.navbar-nav > .notifications-menu {
> .dropdown-menu > li .menu {
// Links inside the menu
> li > a {
color: #444444;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
padding: 10px;
// Icons inside the menu
> .glyphicon,
> .fa,
> .ion {
width: 20px;
}
}
}
}
对于精确的CSS,您可以查看此https://almsaeedstudio.com/preview。我只是尝试使用滚动条功能实现通知图标。
任何人都可以告诉我我在哪里做错了吗?如果有人能给我一个如何使用它的简单例子,那会很棒吗?
P.S。 :https://github.com/asafdav/ng-scrollbar
由于