Идентификатор контейнера событий не меняется - Angular Drag & Drop Material - PullRequest
Новая
       43

Идентификатор контейнера событий не меняется - Angular Drag & Drop Material

0 голосов
/ 27 декабря 2018

У меня проблема с моим проектом Angular.У меня есть массив карт, и каждый компонент карты будет иметь данные карты, которые передаются в этом компоненте.Проблема исходит от модуля перетаскивания.

На самом деле, когда я сбрасываю карту в контейнере, идентификатор, возвращаемый интерфейсом CdkDragDrop, всегда одинаков, идентификатор исходного контейнера ("hand"-player ").

Я новичок с этим интерфейсом, нужно ли что-то, чтобы иметь контейнер для сбрасывания.Возникает ли проблема из моей декларации cdkDrag?

Мой HTML-код для моего компонента "hand-player": 

<div id="hand-player" cdkDropList (cdkDropListDropped)="drop($event)">
<div id = "for" *ngFor="let a of array" cdkDrag>
        <app-carte [carte]="a"></app-carte>
</div>

Мой TS-код для моей "hand-Компонент player ": 

import { Component, OnInit, Host, Input } from '@angular/core';
import {CarteComponent} from '../carte/carte.component';
import {Carte} from '../../interfaces/carte';
import { GameComponent } from '../game.component';
import { CdkDragDrop } from '@angular/cdk/drag-drop';

@Component({
  selector: 'app-hand-player',
  templateUrl: './hand-player.component.html',
  styleUrls: ['./hand-player.component.css'],
})
export class HandPlayerComponent{

  public array:Carte[];

  constructor(@Host() public game: GameComponent){
    this.array = game.joueur.etatMain;
  }

  drop(event: CdkDragDrop<Carte[]>){
    console.log(event.container.id);
  }

}

Компонент моего приложения: 

<div>

    <div id="hand-opponent">
        <app-hand-opponent></app-hand-opponent>
    </div>

    <div id="opponent">
        <app-profile [joueurProfil] = false></app-profile>
    </div>

    <div id="deck">
        <app-deck></app-deck>
    </div>

    <div id="stats">
        <app-infos-game></app-infos-game>
    </div>

    <div id="board-player">
        <app-board-player></app-board-player>
    </div>

    <div id="profile">
        <app-profile [joueurProfil] = true></app-profile>
    </div>

    <div id="board-opponent">
        <app-board-opponent></app-board-opponent>
    </div>

    <div id="hand-player">
        <app-hand-player></app-hand-player>
    </div>

</div>

Мне бы хотелось, чтобы идентификатор:" board-player "возвращался интерфейсом, если я уронил карту вэтот контейнер ...

...