如果条件不成功,则ng2 dnd无法取消拖动事件

时间:2018-06-13 07:39:19

标签: angular typescript

enter code here



  allowDropFunction(): any {

    // console.log("Player last drooped is " + playerSelected);
    if (this.isDragged) {

      return this.playerSelected;
    }

  } 
  
  dragPlayerFirstinnings(e) {
    // console.log("Dragged item is " + e.dragData);
    let index = this.innings1BallOrder.indexOf(e.dragData);
    let previousIndex = this.innings1BallOrder[index - 1];
    let nextIndex = this.innings1BallOrder[index + 1];
    if ((previousIndex['baseInfo']['playerId'] !== e.dragData['baseInfo']['playerId']) && (nextIndex['baseInfo']['playerId'] !== e.dragData['baseInfo']['playerId'])) {
       this.playerSelected = true;
    }
    else {
      // this.playerSelected = false;
      e.preventDefault();
        }
    // this.isDragged = true;


  }
  dragFunction(e){
    this.playerSelected = true;
  }

<div class="liv_over">
                          <div dnd-droppable-container>


                            <table [allowDrop]="isDragged ? allowDropFunction() : null" dnd-sortable-container [sortableData]="innings2BallOrder" dnd-droppable>
                              <thead>
                                <th widh="30%" class="text-center">Bowling Order</th>
                                <th width="50%" class="text-center">Bowler Name</th>
                                <th width="20%" class="text-center">Wickets</th>
                              </thead>
                              <tbody *ngFor='let item of innings2BallOrder;  let i = index' dnd-sortable [sortableIndex]="i">

                                <tr [dragData]="item" dnd-draggable [dragEnabled]="true" (onDragEnd)="dragPlayerFirstinnings($event)">
                                  <td class="contender table_padding" width="50%">{{i+1}}</td>
                                  <td width="24" class="contender table_padding ">{{item.baseInfo.playerName}}</td>
                                  <td width="48" class="contender table_padding ">{{item.bowlingInfo.wickets}}</td>
                                </tr>
                              </tbody>
                            </table>
                          </div>
                        </div>
&#13;
&#13;
&#13;

我基本上想要两个保龄球比赛用相同名称相邻,因为我写的逻辑工作正常,但条件不满足时

&#13;
&#13;
 innings1BallOrder: [
    { 'playername': 'Rohit'},
    { 'playername': 'mukesh' },
    { 'playername': 'Rajat' },
    { 'playername': 'Rohit' },
  ];
 
&#13;
&#13;
&#13;

它没有恢复到以前的位置你能帮助解决问题吗?我在这里添加了虚拟数据,就像在数组中我希望同名玩家不能被拖动

0 个答案:

没有答案