CODEWITHSUNDEEP
angularjs
Rishabh
Rishabh

Reputation: 900

Apply filter based on type of variable while creating dynamic HTML table columns with ng-repeat

I am trying to create a dynamic HTML table with the following data:

myApp.controller('MyCtrl', function($scope) {

  $scope.data = [{
    id: 201,
    text: "Some Text",
    date: new Date("October 13, 2014 11:13:00")
  }, {
    id: 202,
    text: "Other Text",
    date: new Date("October 13, 2014 11:13:00")
  }];

});

HTML:

<div ng-controller="MyCtrl">
  <table>
    <tr>
      <th>ID</th>
      <th>Text</th>
      <th>Date</th>
    </tr>
    <tr ng-repeat="items in data">
      <td ng-repeat="item in items">{{item}}</td>
    </tr>
  </table>
</div>

enter image description here

But I want to apply a date filter every time the inner ng-repeat encounters a date type, but not when it encounters any other type (like string). I checked out some already available solutions but not able to apply them on this case.

Here is the Fiddle.

Upvotes: 1

Views: 91

Answers (1)

Yaron Schwimmer
Yaron Schwimmer

Reputation: 5357

Applying the date filter is the easiest solution. As you can see in the documentation, it will only apply to dates anyway:

Returns string
Formatted string or the input if input is not recognized as date/millis.

So this is valid:

<td ng-repeat="item in items">{{item | date}}</td>

Even if item is not a date.

See updated fiddle.

Update

Since you also have numeric values, I think there has to be something less generic in the code, to check if the current field should be treated as a date.

Consider the following:

<td ng-repeat="(key, item) in items">{{isDate(key) ? (item | date) : item}}</td>

Controller code:

$scope.isDate = function(key) {
    if (key === 'date') {//add more conditions if necessary
        return true;
    }
    return false;
}

Fiddle

Upvotes: 2

Related Questions