Take the result of ng-repeat and use in Moment.js

Question

I have an app that uses a ng-repeat to list information. One of this information comes with a date as an example below, what happens is that I wanted to use the relative function of moment.Js. My difficulty is to take this received value and use in the right parameters of moment.js.

<tbody>
    <tr ng-repeat="x in names">
        <td>
            {{ x.TempoEspera }} 
        </td> 
    </tr>                                               
</tbody>

received value= "Time":"11/13/2014 17:17:47"

Answer 1

You can make a filter that receives the date and format as you wish:

angular.module("app", []);

angular.module('app').controller("myctrl", function() {
  
  var ctrl = this;
  ctrl.names = [{tempoEspera: "2015-01-01T01:00:00"}, {tempoEspera: "2016-01-01T23:00:59"}]

});

// cria um filtro que receba uma data e formata-a atraves do momentjs
angular.module('app').filter('formatarData', function() {
  return function(input) {

    if (!input) {
      return '';
    }

    return moment(input).format("LLLL"); // formata conforme a localização do utilizador. Alterar esta linha para alterar a forma como a data e formatada.
  }
});

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.11.2/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0/angular.min.js"></script>

<div ng-app="app" ng-controller="myctrl as ctrl">
  <table class="table table-bordered table-striped">
    <thead>
      <tr>
        <th>Test</th>
      </tr>
    </thead>
    <tbody>
      <tr ng-repeat="x in ctrl.names">
        <!--A cada iteração do ng-repeat, o filtro formatarData e aplicado ao conteudo da variavel x.TempoEspera -->
        <td>{{x.tempoEspera | formatarData}}</td>
      </tr>
    </tbody>
  </table>
</div>

In the example above, a filter called formatarData which receives a string representing a date and formats it using the momentjs.

In this specific case, format the date in the format LLLL - Month name, day of Month, day of week, year, time.

However, you can change the filter code to format the date to whatever format you need.