0

Добрый вечер, есть функция которая позволяет перемещать с одного блока в другой. Нужна помощь в реализации того чтоб можно было те блоки которые перенесены удалять при клике на допустим крестик в углу. Это HTML

<div class="container" ng-controller="MainCtrl">
  <div class="drag-object" ng-repeat="obj in draggableObjects" ng-if="obj.allowClone !== false">
      {{obj.name}}
      <div ng-drag="true" ng-drag-data="obj"></div>
  </div>
  <div class="drag-object"  style="background-color: transparent; overflow: visible">
      <div ng-drag="true" class="drag-object" ng-drag-data="draggableObjects[3]">{{draggableObjects[3].name}}</div>
  </div>
  <hr/>
  <div ng-drop="true" ng-drop-success="onDropComplete1($data,$event)">
      <span class="title">Drop area #1</span>
      <div ng-repeat="obj in droppedObjects1" ng-drag="true" ng-drag-data="obj" ng-drag-success="onDragSuccess1($data,$event)">
          {{obj.name}}
      </div>
  </div>

Вот собственно Angular

angular.module('ExampleApp', ['ngDraggable']).
  controller('MainCtrl', function ($scope) {
    $scope.draggableObjects = [{name:'one'}, {name:'two'}, {name:'three'}, {name:'no-clone', allowClone:false}];
    $scope.droppedObjects1 = [];
    $scope.droppedObjects2= [];
    $scope.onDropComplete1=function(data,evt){
        var index = $scope.droppedObjects1.indexOf(data);
        if (index == -1)
        $scope.droppedObjects1.push(data);
    }
    $scope.onDragSuccess1=function(data,evt){
        var index = $scope.droppedObjects1.indexOf(data);
        if (index > -1) {
            $scope.droppedObjects1.splice(index, 1);
        }
    }
    var inArray = function(array, obj) {
        var index = array.indexOf(obj);
    }

и есть ли какая-то реализация того чтоб когда блок перенесен допустим не один а несколько, между ними соединялась стрелка? Буду очень признателен за помощь. Просто только осваиваю Angular зеленый еще)

1
  • Я так понимаю нужна функция, которая будет отрабатывать по событию ng-click. 8 апр 2017 в 21:21

1 ответ 1

0

html

<div ng-repeat="obj in droppedObjects1" ng-drag="true" ng-drag-data="obj" ng-drag-success="onDragSuccess1($data,$event)" ng-click="removeItem(obj)">

js

$scope.removeItem = function(item) {
    var index = $scope.droppedObjects1.indexOf(item);

    if (index > -1) {
        $scope.droppedObjects1.splice(index, 1);
    }
}

Зеленую стрелку наврятле найдете готовую.

6
  • Спасибо, помог - но блоки удаляются только после того как в области видимости появляется более одного, если он там один, удалить его нельзя. 9 апр 2017 в 10:33
  • Должен работать, выложите пример на проблемой plnkr.co/edit/?p=catalogue 9 апр 2017 в 10:38
  • @ОлегНормпасан как минимум сначала надо подключать библиотеки, а потом свой код, который использует библиотеки. Посмотрите ошибки в консоли 9 апр 2017 в 13:22
  • Вот все сделал, plnkr.co/edit/pgclq7FvafgmJPo4Lmqn?p=preview Но не удаляеться первый Элемент 9 апр 2017 в 13:38
  • 1
    Вопрос решен, удалив значение из front части ng-drag="true" 11 апр 2017 в 13:14

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.