好的,我有以下列表:
<ul class="list-group gutter list-group-lg list-group-sp" ui-sortable="" ng-model="academyModules">
<li class="list-group-item module" style="padding-top: 15px; padding-bottom: 0px;" ng-repeat="module in academyModules" draggable="true">
<div class="clear" ng-if="module.module.module_type_id != null">
<div class="col-md-4 col-xs-10">
<button class="btn btn-s-xs btn-rounded m-r-lg" ng-class="module.module_type.color || module.module.module_type.color"
style="padding: 2px 10px; min-width: 90px;">{{module.module_type.name || module.module.module_type.name}}
</button>
<span class="text text-muted">Modul</span>
</div>
<span class="pull-right">
<a class="btn btn-md pull-right no-padder" ng-really-message="Er du sikker du vil slette modulet?" ng-really-click="deleteModule($index, module);">
<i class="fa fa-times text-danger text"></i></a>
</span>
<div class="col-lg-5 col-xs-11">
<div class="input-group m-b">
<div class="input-group-btn">
<button class="btn btn-info" ng-click="changeModule(module)" data-toggle="modal"
data-target="#modal_select_module" style="font-size: 10px;"
type="button"><i class="fa fa-plus"></i> Skift modul
</button>
</div>
<!-- /btn-group -->
<input type="text" class="form-control input-sm" value="{{module.module.name}}" style="height: 27px" disabled="">
</div>
</div>
</div>
<div class="clear" ng-if="module.module.module_type_id == null">
<div class="col-md-4 col-xs-10">
<button class="btn btn-s-xs btn-rounded m-r-lg bg-grey"
style="padding: 2px 10px; min-width: 90px;">Kursus
</button>
<span class="text text-muted">Modul</span>
</div>
<span class="pull-right">
<a class="btn btn-md pull-right no-padder" title="" ng-really-message="Er du sikker du vil slette kurset?" ng-really-click="deleteCourse($index, module);"><i
class="fa fa-times text-danger text"></i></a>
</span>
<div class="col-lg-5 col-xs-11">
<div class="input-group m-b">
<div class="input-group-btn">
<button class="btn btn-info" ng-click="changeCourse(module)" data-toggle="modal"
data-target="#modal_select_module" style="font-size: 10px;"
type="button"><i class="fa fa-edit"></i> Ret kursus
</button>
</div>
<!-- /btn-group -->
<input type="text" class="form-control input-sm" value="{{module.name}}" style="height: 27px" disabled="">
</div>
</div>
</div>
</li>
</ul>
这会产生一个如下所示的列表:
现在,当项目很少时,这种方法很好,但是当列表足够大并且滚动拖放时会出现混乱。当我在页面中间拾取一个项目时,它总是滚动到底部,很难再次登上顶部!
之前是否有人尝试过此操作或知道修复方法?