Вопрос

У меня есть список элементов, которые необходимо сортировать, что само по себе несложно реализовать с помощью jQuery.На основе этот код Я поместил эту функциональность в директиву Angular, чтобы моя модель оставалась актуальной при изменении порядка элементов в списке.

Мой список имеет разные цвета строк в зависимости от того, четная это строка или нечетная, а также два символа, которые меняют цвет в зависимости от того, является ли элемент первым или последним в списке.Я создал скрипка, чтобы показать пример.

Проблема в том, что перетаскивание элемента портит макет, и цветные символы не обновляются при перетаскивании элемента.Когда элемент выпущен, список обновляется и снова выглядит красиво.

Мой вопрос:Как поддерживать актуальность списка при перемещении элемента?Я пробовал с change функцию обратного вызова, но я понятия не имею, как узнать, какую позицию в данный момент занимает мой перетаскиваемый элемент.А ui-объект не содержит информации об этом, насколько мне известно.При обновлении модели идея заключается в том, что DOM также будет обновляться.Сбросит ли это мое перетаскивание?

Еще я попробовал создать контейнер для текста, чтобы фон не перетаскивался вместе с элементом (это все равно не решает проблему с обновлением цветных символов), но заставить его работать так, как требуется, мне не удалось.

Надеюсь, вы сможете помочь.

Редактировать:После хорошего ночного сна я проснулся и обнаружил ui.placeholder.index() в change-event получает текущую позицию перетаскиваемого элемента.Используя это, я могу обновить модель, но стиль при перетаскивании по-прежнему остается беспорядочным.

С наилучшими пожеланиями

Это было полезно?

Решение

Если кому-то интересно, у меня в итоге получился хак.Я сначала создал фон, а затем добавил элементы в список.Таким образом, фон не изменится при перетаскивании моих предметов.

Что касается обновления моей модели, у меня возникла проблема с change событие вызывается дважды, поэтому я отказался от этой идеи.

Эта обновленная скрипка показывает мое решение.

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top