Dragula - 以角度2拖放列

时间:2017-05-16 13:41:56

标签: angular ng2-dragula

我使用Dragula拖放我的桌子。我还使用插件角度resizier元素来调整表格列Plugin url here的大小。所有这些我一直在Angular2工作。

以下是我实现此目标的代码的一部分。

<div class="row first-row" [dragula]='"evented-bag"' [dragulaModel]='columns'>

    <div *ngFor="let rowTitle of columns; let i = index" class="col"
         [style.min-width.px]="rowTitle.width" 
         [style.width.px]="rowTitle.width" 
         [attr.column-name]="rowTitle.name"
         mwlResizable
         [validateResize]="validate"
         [resizeEdges]="{bottom: false, right: true, top: false, left: false}"
         [enableGhostResize]="false"
         (resizeEnd)="onResizeEnd($event, rowTitle)">

        <label>
            {{rowTitle.name}}
            <a (click)="sortColumn(rowTitle.key)">
            </a>
        </label>
    </div>
    <div class="col" *ngIf="columnNames.length != 0">
        <label>More</label>
    </div>
</div>

因此,需要使用* ngFor将div放置在div之前的div上。然后dragula使用每个表格列的全宽。

问题是当我想调整列的大小时,当我开始拖动右边框(因为我这样做)来调整它的大小时,它也开始拖动整列。在某些情况下,它会调整列的大小,但在大多数情况下会移动列。

我尝试过的解决方案的一部分是使dragula列更小,而不是在div中放置另一个div class="col",其中是angular-resizable-element,并在div上添加一些左右填充。但这部分不成功。

问题:有人可以帮助我让dragulaangular-resizable-element毫无困难地一起工作。

0 个答案:

没有答案