emanuelefricano93 / frxjs-Ngx-Timeline

NgxTimeline Angular Library
28 stars 9 forks source link

Date with Title #32

Closed Monali-Zala closed 6 months ago

Monali-Zala commented 6 months ago

Hello I have to implement the title with date but date should be this format like currently you was mentioned. I try but facing some issue with date So kindly give the solution. also i want the content-items on the righr sde MicrosoftTeams-image (4)

emanuelefricano93 commented 6 months ago

Hello @Monali-Zala , to put everything on the right you can set the itemPosition of each of your events

image

As described in the README.md interface NgxTimelineEvent { timestamp?: Date; title?: string; description?: string; id?: any; itemPosition?: NgxTimelineItemPosition; }

this is an example

this.events = [ { id: 5, description: 'This is the description of the event 5', timestamp: nextYear, title: 'title 5', itemPosition: NgxTimelineItemPosition.ON_RIGHT }, { id: 0, description: 'This is the description of the event 0', timestamp: today, title: 'title 0', itemPosition: NgxTimelineItemPosition.ON_RIGHT }, { id: 1, description: 'This is the description of the event 1', timestamp: tomorrow, title: 'title 1', itemPosition: NgxTimelineItemPosition.ON_RIGHT }, { id: 2, description: 'This is the description of the event 2', timestamp: today, title: 'title 2', itemPosition: NgxTimelineItemPosition.ON_RIGHT }, { id: 3, description: 'This is the description of the event 3', timestamp: tomorrow, title: 'title 3', itemPosition: NgxTimelineItemPosition.ON_RIGHT }, { id: 4, description: 'This is the description of the event 4', timestamp: nextMonth, title: 'title 4',itemPosition: NgxTimelineItemPosition.ON_RIGHT /itemPosition: NgxTimelineItemPosition.ON_RIGHT /}, ];

About the date i am not able to understand your problem, but you have your events and you can set the title you want to set, formatting it before creating your list

Monali-Zala commented 6 months ago

For the date I have to put the title with timestamp. But we have to make sure date format is not change. This is i am trying but I am not able to solve. Thank you for the support and solutions.

emanuelefricano93 commented 6 months ago

You should set the Date in the title using the angular date pipe

https://angular.io/api/common/DatePipe

Monali-Zala commented 6 months ago

But I don't want to set Date in title I want to set title in timeStamp.

emanuelefricano93 commented 6 months ago

Try do to an example, because again you can control the title and you can set what you want . Try to put a graphic example so I can understand

Monali-Zala commented 6 months ago

title

I have attached this image for your understanding what I want to with title and timeStamp. I want title just above the date as shown in the image.