Simple directive to get human readable timespans from any two dates
bower install angular-timespan
Or download the full file or the minified version from the dist folder.
Then include the file in your application (adding the script tag, using require... ) and add it to your app:
angular.module('myApp',[
'aurbano.timespan'
// ...
].run([
/* ... */
]);
Add the directive with the difference between any two dates to get them in a readable manner:
Sent <span timespan="dateDiff"></span> ago.
<!-- Generates (for example): -->
Sent 14 days ago
Where dateDiff is the difference in milliseconds: $scope.dateDiff = new Date() - startDate;
You can specify timespan-opts
with an object containing the custom settings you want for the timespan display:
Sent <span timespan="dateDiff" timespan-opts="timespanConfig"></span> ago.
And in your controller:
$scope.timespanConfig = {
lessThanFirst: 'now', // What to display if the diff is less than the first available unit
millisecond: 'ms', // ------------------------------------
second: 's', //
minute: 'm', //
hour: 'h', // Labels for each unit, use them for
day: 'd', // shorthand units, localization...
week: 'w', // Set any to `false` to disable it
month: 'mo', //
year: 'y', // ------------------------------------
space: false, // Whether to add a space between the number and the label
pluralize: false // Whether to add an 's' to the label if the diff > 1
};
Feel free to submit any issues or modifications in Pull Requests. If you are adding a feature it would be great if you also documented it in the Readme, or at least in the PR comment.
This directive is released under the MIT License
Developed by Alejandro U. Alvarez