Я пытаюсь использовать функцию «перетаскивания» с внешними событиями.
Это работает, за исключением случаев, когда я использую * ngFor:
Мой HTML-файл:
<p>Interventions en attente</p>
<ul id='external-events'>
<li *ngFor="let ticket of ticketList">
<div class='fc-event'>{{ ticket.message }}</div> // Doesn't Work !!
</li>
<li>
<div class='fc-event'>My Event 1</div> // Works !!
</li>
</ul>
Вот мой файл TS:
ngAfterViewInit() {
$('#external-events .fc-event').each(function () {
// store data so the calendar knows to render an event upon drop
$(this).data('event', {
title: $.trim($(this).text()), // use the element's text as the event title
stick: true // maintain when user navigates (see docs on the renderEvent method)
});
// make the event draggable using jQuery UI
$(this).draggable({
zIndex: 999,
revert: true, // will cause the event to go back to its
revertDuration: 0 // original position after the drag
});
});
}
Как я могу это решить?
**************** ОБНОВЛЕНИЕ 2 ***********************
Вот мой новый метод getTickets, следуя советам в комментарии:
getNewTickets() {
this.loading = false;
this.myJarviaServices.getNewTickets()
.subscribe(resp => {
console.log('angular');
this.ticketList = resp.content;
console.log(this.ticketList);
this.customevents.forEach(function (item) {
// store data so the calendar knows to render an event upon drop
$(item.nativeElement).data('event', {
title: $.trim($(item.nativeElement).text()), // use the element's text as the event title
stick: true // maintain when user navigates (see docs on the renderEvent method)
});
// make the event draggable using jQuery UI
$(item.nativeElement).draggable({
zIndex: 999,
revert: true, // will cause the event to go back to its
revertDuration: 0 // original position after the drag
});
});
},
error => {
console.log('authService.login error' + error);
console.log('error status : ' + error.status);
// this.alertService.error(error);
this.myJarviaServices.error(error);
});
}
У меня нет сообщения об ошибкено это не работает