This is a custom filter to show a bytes filesize in better way.

filesize-filter.js

// add the filter to your application module
angular.module('myApp', ['filters']);

/**
 * Filesize Filter
 * @Param length, default is 0
 * @return string
 */
angular.module('filters', [])
  .filter('Filesize', function () {
		return function (size) {
			if (isNaN(size))
				size = 0;

			if (size < 1024)
				return size + ' Bytes';

			size /= 1024;

			if (size < 1024)
				return size.toFixed(2) + ' Kb';

			size /= 1024;

			if (size < 1024)
				return size.toFixed(2) + ' Mb';

			size /= 1024;

			if (size < 1024)
				return size.toFixed(2) + ' Gb';

			size /= 1024;

			return size.toFixed(2) + ' Tb';
		};
	});

/**
 * Usage
 * var myFile = 5678;
 *
 * {{myText|filesize}}
 *
 * Output
 * "5.54 Kb"
 *
 */

changes

• simplified with a small loop,
• added fix for Infinity,
• added PB unit,
• fixed unit names,
• added precision param

app.filter( 'filesize', function () {
  var units = [
    'bytes',
    'KB',
    'MB',
    'GB',
    'TB',
    'PB'
  ];

  return function( bytes, precision ) {
    if ( isNaN( parseFloat( bytes )) || ! isFinite( bytes ) ) {
      return '?';
    }

    var unit = 0;

    while ( bytes >= 1024 ) {
      bytes /= 1024;
      unit ++;
    }

    return bytes.toFixed( + precision ) + ' ' + units[ unit ];
  };
});

---

Usage

JS

var size = 5678;

template

{{ size | filesize }}, {{ size | filename:2 }}

Output

6 KB, 5.54 KB

Clean and useful. Thanks for your work 👍

It is useful.

Just use a8m/angular-filter kbFmt filter

@icem kbFmt filter does not support anything greater than GB.

This is still in the first Google search results page, so, please don't use a loop for this. Have a look at https://gist.github.com/thomseddon/3511330#gistcomment-1703533 instead.