CODEWITHSUNDEEP
angularjs
user1937021
user1937021

Reputation: 10781

Create filter based on date Angularjs

I am loading in this JSON into my angular app:

http://www.football-data.org/teams/354/fixtures/?callback=JSON_CALLBACK

I would like to only load fixtures that are up-coming i.e only show the fixture details that are later than the present time.

I have a controller as so:

 .controller('fixturesController', function($scope, $routeParams, footballdataAPIservice) {
    $scope.id = $routeParams.id;
    $scope.fixtures = [];
    $scope.pageClass = 'page-fixtures';

    footballdataAPIservice.getFixtures($scope.id).success(function (response) {
        $scope.fixtures = response; 
    }); 

});

HTML

<tr ng-repeat="fixture in fixtures.fixtures">
        <td>{{$index + 1}}</td>
        <td>{{teamName(fixture.awayTeam)}}</td>

Not sure how to do this, especially with the format I have for the time and day: "2015-03-14T15:00:00Z"

Upvotes: 0

Views: 64

Answers (1)

Simon Wicki
Simon Wicki

Reputation: 4059

Your dates are already in the correct format for a date conversion, so you only need to create a filter yourself.

I'd just create a custom filter like the one I put down here. Adjust it to your needs.

angular.module('yourApp')
    .filter('greaterThan', function() {
        return function (actualDate, comparisonDate) {
            return Date(actualDate) > Date(comparisonDate);
        };
    });

Then your HTML could look like this:

<tr ng-repeat="fixture in fixtures.fixtures | greaterThan:fixture.date:'2015-03-14T15:00:00Z'">
    ...
</tr>

Upvotes: 1

Related Questions