Hi Petro,
You can add tooltip for the block events by using the EJ2
Tooltip’s beforeRender event, as shown in the below shared snippet.
Sample: https://stackblitz.com/edit/ej2-angular-schedule-tooltip-for-block-events-fj4hhq?file=src%2Fapp.component.ts
API: https://ej2.syncfusion.com/angular/documentation/api/tooltip/#beforeopen
[app.component.html]
|
<div class="control-section">
<ejs-tooltip #tooltipObj (beforeRender)="onBeforeRender($event)">
<ejs-schedule #scheduleObj height='650px' [(selectedDate)]="selectedDate" [eventSettings]="eventSettings"></ejs-schedule>
</ejs-tooltip>
</div>
|
[app.component.ts]
|
export class AppComponent {
@ViewChild('tooltipObj')public tooltipObj: ScheduleComponent;
public eventSettings: EventSettingsModel = { enableTooltip: true };
public target: string = '.e-block-appointment’;
public onBeforeRender(args: TooltipEventArgs): void {
let content: string;
if (args.target.classList.contains('e-block-appointment')) {
content = (args.target.querySelector('.e-subject') as any).innerText;
}
this.tooltipObj.setProperties({ content: content }, true);
}
}
|
Regards,
Swathi Ravi
