Как сделать некоторые элементы div не перетаскиваемыми с помощью Dragula для Angular 2

Мне удалось успешно интегрировать ng2-dragula в свой проект, но я до сих пор не могу понять, как создать некоторые блоки non draggable.

Я пробовал использовать css, а также htmls draggable="false" для div, но безуспешно. Похоже, что бы я ни поставил, dragula потом вставит свои директивы и все переопределит. Может я ошибаюсь ...

Кто-нибудь знает, как этого добиться?

Например:

<div [dragula]="'group'">
    <div>1</div>
    <div>2</div>
    <div [dragula]="'group'">
        <div>3</div>
        <div class="donotdrag">4</div>
        <div>5</div>
    </div>
</div>

Как сделать div с классом donotdrag не перетаскиваемым?


person Brian    schedule 20.07.2016    source источник


Ответы (1)


Для этого можно использовать недопустимые параметры.

Просто установите параметры с помощью dragulaService.setOptions в конструкторе компонентов, например:

dragulaService.setOptions('group', {
  invalid: (el, handle) => el.classList.contains('donotdrag')
});

Демо-плункер

person yurzui    schedule 20.07.2016
comment
@Brian Поместите ! перед el.classList.contains('donotdrag'), как !el.classList.contains('donotdrag') - person yurzui; 20.07.2016
comment
Кроме того, если вы получаете сообщение об ошибке - BAG_NAME уже существует, используйте viewProviders: [DragulaService] в своем компоненте, это должно решить проблему. - person Vintesh; 15.12.2016