Filter to covert a moment object to a timezone.

angular
  .module('plunker', []);

angular
  .module('plunker')
  .controller('TimeController', function() {
    var vm = this;

    vm.dateTimeNow = moment();
  });

// filter to set the timezone, assumes incoming time is in UTC
angular
  .module('plunker')
  .filter('toUserTimezone', function() {
    return function(input, format, offset) {

      var output, timezoneText, inputCopy;
      
      // we need to copy the object so we don't cause any side-effects
      inputCopy = angular.copy(input);

      // check to make sure a moment object was passed
      if (!moment.isMoment(inputCopy)) {
        // do nothing
        return input;

      } else {
        // set default offset change to 0
        offset = offset || 0;

        // change the time by the offet  
        inputCopy.add(offset, 'hours');

        // this will need to be improved so the added text is in the format +hh:mm
        offset >= 0 ? timezoneText = '+' + offset : timezoneText = offset;
        
        // format the output to the requested format and add the timezone 
        output = inputCopy.format(format) + ' ' + timezoneText;

        return output;
      }
    };
  });

<!DOCTYPE html>
<html ng-app="plunker">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
    <script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.0-rc.1/angular.js" data-semver="1.4.0-rc.1"></script>
    <script data-require="moment.js@2.8.3" data-semver="2.8.3" src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.3/moment.min.js"></script>
    <script src="app.js"></script>
  </head>

  <body ng-controller="TimeController as vm">
    <h3>Demo of "toUserTimezone" Filter</h3>
    <p>Time Now: {{ vm.dateTimeNow | toUserTimezone : "dddd, MMMM Do YYYY, HH:mm:ss" }}
    <p>Time at UTC-5: {{ vm.dateTimeNow | toUserTimezone : "dddd, MMMM Do YYYY, HH:mm:ss" : -5 }} </p>
    <p>Time at UTC+7: {{ vm.dateTimeNow | toUserTimezone : "dddd, MMMM Do YYYY, HH:mm:ss" : 7 }} </p>
    <form>
    Enter a zone: <input type=text ng-model="vm.userOffset">
    </form>
    <p>Time at {{ vm.userOffset }} : {{ vm.dateTimeNow | toUserTimezone : "dddd, MMMM Do YYYY, HH:mm:ss" : vm.userOffset }} </p>
  </body>

</html>

/* Put your css in here */