Dragula Drag只想要元素

Question

这是我的component.html

<div class="row" [dragula]='"photos-bag"' [dragulaModel]='photos'>
    <div *ngFor="let photo of photos" [class.sortable]="photo.sortable">
        <a href="#" class="thumbnail" > 
            <img src="http://placehold.it/140.png" > 
        </a>
        {{ photo.name }}
    </div>                                                                                                                                                                                                      
</div>

，这是我的组件中的一部分。

dragulaService.setOptions('photos-bag', {
    moves: function(el, source, handle, sibling) {
            return el.classList.contains('sortable');
        },
});

现在是问题..是否有一个选择只能切换具有sortable类的元素？..所以我认为接受/无效的选项将可以解决问题，但似乎却没有。

Answer 1

使用[class.sortable] =" photo.sortable"使用 [className] =" cssclass（photo）"

.html

<div class="row" [dragula]='"photos-bag"' [dragulaModel]='photos'>
    <div *ngFor="let photo of photos" [className]="cssClass(photo)>
        <a href="#" class="thumbnail" > 
            <img src="" > 
        </a>
        {{ photo.name }}
    </div>                                                                                                                                                                                                      
</div>

.ts文件

cssClass(photo){
   // based on condition return "draggable CSS" or **Non draggable CSS** 
}

dragulaservice

dragulaService.setOptions('photos-bag', {
    moves: function(el, source, handle, sibling) {
           return el.className === "draggableCSS"?true:false
        },
});

如果仍然不工作，请创建plunker。