Angular Js 날짜별로 레코드를 필터링하는 방법은 무엇입니까?

Question

각도 js에서 작업 중이며 json 배열의 API에서 데이터가 전송됩니다. 캘린더에서 선택한 날짜 범위에 따라 필터를 추가해야합니다. 내 날짜는 "from"과 "to"두 필드로 나옵니다. 또는 하나의 날짜 일 수 있으며 json의 만료 날짜에 따라 레코드를 표시해야합니다.

사용자가 날짜 범위를 선택하고 검색을 클릭하면 선택한 레코드를 가져와야합니다. 컨트롤러 파일의 내 js입니다.

localStorageService.set('usersOpen', users.openUsers); 
localStorageService.bind($scope, 'usersOpen'); 

users.myUsers = myUsers; 
     function myUsers(start_date,end_date){ 
      DataService.myOpenUsers() 
       .then(function successCallback(response) { 
       $scope.usersOpen.length = 0; 
       $scope.usersOpen.push({'data': response.data.results}); 
      }, function errorCallback(response) { 

      }); 

이것은 필터링해야하는 json 형식입니다.

{ 
    "results": [{ 
    "id": "999896", 
    "description": "Description Testingggg", 
    "picturesUrl": [], 
    "assigID": [{ 
     "userId": "67767776", 
     "email": "test@gmail.com", 
     "firstName": "test", 
     "lastName": "User", 
     "pictureUrl": "", 
     "notifyStatus": "None", 

    }], 
    "expiryDate": "2016-10-14T17:48:50.100Z", 
    "createdUserId": "8887900", 
    "status": "Open", 
    "dtModified": "2016-10-14T12:21:27.431Z" 
    },{ 
    "id": "999897", 
    "description": "New Tested Description", 
    "picturesUrl": [], 
    "assignedTo": [{ 
     "userId": "887997", 
     "email": null, 
     "firstName": "testing", 
     "lastName": "users2", 
     "pictureUrl": null, 
     "notifyStatus": "None", 
     "devices": [] 
    }, { 
     "userId": "887997", 
     "email": "testing@hotmail.com", 
     "firstName": "Testing", 
     "lastName": "User2", 
     "pictureUrl": "", 
     "notifyStatus": "None", 

    }], 
    "expiryDate": "2016-10-11T09:46:09.100Z", 
    "createdUserId": "887997", 
    "status": "Open", 
    "location": { 
     "lat": 12.1, 
     "lon": -3.1 
    }, 
    "dtModified": "2016-10-11T09:36:30.217Z" 
    }] 
} 

이것은 레코드를 얻는 html입니다. 네이티브 자바 스크립트 필터를 사용할 수있는 문제에 대한

<ul>       
<li ng-repeat="users in usersOpen[0].data track by $index" class="{{users.status}} {{yit.id}}">       
<div class="content-box"> 
<div class="text-box"> 
{{users.description}} 
</div> 
{{users.expiryDate}}  
</div> 
{{users.firstName}} 
</li> 
</ul> 

Answer 1

:이 같은 필터링 날짜 범위에 대한 사용자 정의 필터를 만들 수 있습니다

response.data.results.filter(function(user){ 
    return //add your date test here on user.expiryDate 
} 

Answer 2

을

필터

app.filter('dateFilter', function() { 
     return function(input, start, end) { 
     var inputDate = new Date(input), 
      startDate = new Date(start), 
      endDate = new Date(end), 
      result = []; 

     for (var i = 0, len = input.length; i < len; i++) { 
      inputDate = new Date(input[i].DepartureDateTime); 
      if (startDate < inputDate && inputDate < endDate) { 
      result.push(input[i]); 
      } 
     } 
     return result; 
     }; 
    }); 

및 HTML

<div ng-controller="MyController"> 
     <div ng-repeat="data in Combination | dateFilter:startDate:endDate "> 
      <div >{{data.DepartureDateTime}}</div> 
     </div> 
</div> 

DEMO

Answer 3

당신은 AngularJS와 $ 필터를 사용할 수 있습니다, 당신은 당신이 원하는 어떤 형식으로 컨트롤러와 필터에서 $ 필터를 삽입해야합니다.

$filter('date')(new Date(expiryDate), "M/d/yyyy"); 

는이 날짜 범위 내에서 사용자 데이터를 얻기 위해, 그것은 브라우저에서 일관성 이후 날짜 구문 분석 순간을 사용하는 것이 좋습니다 코드

var fromTime = new Date("2015-04-23").getTime(); 
var toTime = new Date("2015-04-28").getTime(); 

var filteredDataByDates = []; 
var row, date; 

for (i in data) { 

    row = data[i]; 
    date = new Date(row[4]); 

    if (date.getTime() >= fromTime && date.getTime() <= toTime) { 
    filteredDataByDates.push(row); 
    } 
}