구성 요소 함수에서 Angular2 애니메이션으로 데이터를 주입

Question

각도 2에서 <li> 요소가 마우스 (ondrag) 다음에오고 (ondragend) 뒤에 위치하는 구성 요소를 만들기 위해 @angular/animations을 사용하려고합니다. 나는이 문제를 해결할 수있는 가장 좋은 방법이 무엇인지에 관해서는 매우 새롭다. 내 구성 요소의 문자열을 애니메이션에 다시 삽입 할 수는 있지만 가능한지 확실하지 않습니다. 아래 예를 참조하십시오. 애니메이션에 데이터를 주입면에서

import { Component } from '@angular/core'; 

import { trigger, state, style, animate, transition } from '@angular/animations'; 

@Component({ 
    selector: 'test-test', 
    template: ` 
    <li 
    *ngFor="let letter of list" 
    [@lettereState]="letter.state" 
    (ondrag)="letter.toggleState(); mouseCords($event.clientX, $event.clientY);" 
    (ondragend)="letter.toggleState()"> 
     {{letter}} 
    </li> `, 
    animations: [ 
    trigger('letterState', [ 
     state('active', style({ 
     transform: //'translate(Inject the cordinates here {mouseX}, {mouseY})', 
     })), 
    ]) 
    ], 

}) 
export class LetterBankComponent { 

    constructor(
) {} 

    private list = ['a', 'b', 'c'] 
    private mouseX = '' 
    private mouseY = '' 
    } 
    mouseCords(x, y) { 
     mouseX = x; 
     mouseY = y; 
    } 

Answer 1

그것은 기능 요청하고 (https://github.com/angular/angular/issues/9668 참조) 아마 곧이다. 요소에 [draggable]을 추가하는 방법으로이 문제를 해결할 수 있습니다.