Angularify a beautiful timeline
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.

Angularify a beautiful timeline

Danilo Del Fio

A few days ago I found a snippet of code that was for me. I needed to create a timeline that could handle the feed of a user and the responses of other users. After a lot of research, I finally found a snippet Timeline. Thank you to Sergiors. I wish, therefore, to find ways to make the timeline dynamics and to do this I helped our friend AngularJS.

I have created, therefore, a directive that used data from a service (easily editable through the call to $http or Restangular service for example) and that allowed me to manage the various types of entry required.

So, I created two directives, in which one contained the other. The parent Directive:

'<ul class="timeline"><ddf-timeline-entry ng-repeat="feed in timelineEntries"></ddf-timeline-entry></ul>'

This one contains the built-in directive ng-repeat for iterate our timeline entries and my directive ddf-timeline-entry that define the behaviour of every entry.

The ddf-timeline-entry is defined by a separated file named timelineEntry.html.