2013-07-26 2 views
0

저는 Json 객체를 컨트롤러에 RoR 메소드로 만들어서 Json을 Time과 함께 보냈습니다.

데이터베이스는 스마트 폰으로 채워집니다. RoR 응용 프로그램은 Json 파일을 만들고 내 각도 서비스는 $ http를 통해이 Json을 얻도록 청구됩니다.

내 질문은 :DB에 새 데이터가 있고 페이지를 새로 고치지 않고 Json에서 새 데이터를 충전하면 실시간으로 angularJS 검사를 수행 할 수 있습니까? 예를 들어, 개체의 시간이있는 응용 프로그램은 DB에 저장되어 있습니다. 시간이 30 분 미만인 경우 값을 표시하고 싶습니다. 그렇지 않다면 나는 그 요점을 표시하지 않습니다. 응용 프로그램을로드하면 작동하지만 시간이 오래되었거나 (> 30 분 전) 또는 여전히 사용 가능한 경우이 메서드 또는 매초마다 확인하는 사용자가 실시간으로 원합니다.

해결책이 있습니까? 구현 방법에 대한 팁이 있으면 알려주세요. 사전

답변

2

에 의해

덕분에 나는 당신이 정기적으로 서버에서 데이터를 폴링하기 위해 각도에서 $ 제한 시간을 사용하여 시도 할 수 있다고 생각

로서 (귀하의 경우 30 분 이하 등) 당신의 데이터가없는 예제를 만들 수 없었고, 그것이 작동하는지 확인하기 위해 30 분을 머물고 싶지 않았습니다. 나는이 바이올린을 만들었습니다 : http://jsfiddle.net/DotDotDot/mgSWt/3/, 데이터 쿼리를 시뮬레이트합니다 ($ http)를 입력 한 다음 제한 시간 내에 항목 만 표시하도록 분석하십시오.

더 정확하게 말하면, 페이지가 하나의로드 시간에 대응하는, 제어기의 시작 3 개 변수 eate, 2 분 전 (그러나 30 분에 전달하기 쉽게) : 그 후

var n=new Date() 
var onemin=n.getTime()-60*1000//one min from now 
var twomin=n.getTime()-60*1000*2//two min from now 

, I 함수를 만들 데이터를 얻으려면 (예를 들어, 서비스로는 더 나을 수 있다고 생각하지만 다른 질문입니다). 이 함수는 전체 데이터를 가져오고 (적어도 내 예제에서는 하드 코드로 표시) 표시 할 항목을 확인합니다. 그런 다음이 함수를 호출하고 함수 자체가 다음 실행 시간을 예약합니다 (예를 들어, 다른 값으로 설정해야하는 항목, 30 분 미만, 응용 프로그램에 따라 다름).

$scope.updateData=function(){ 
    $timeout(function(){ 
     //$http.get('/your/url').success(...).error(...) 
     //you should get your data here, but I just force it for the example 
    $scope.rawData=[{"time":n.getTime(),"content":"The value created when the page loaded"}, 
       {"time":onemin,"content":"The value was created one minute before the page load"}, 
       {"time":twomin,"content":"The value was created two minute before the page load"}]; 
    console.log($scope.rawData) 
    var whatTimeIsIt=new Date(); 
    $scope.data=Array()//erasing any previous data 
    $scope.notShown=Array();//for the test 
    for(var i in $scope.rawData){ 
     if($scope.rawData[i].time>(whatTimeIsIt.getTime() - 90*1000))//checking each value time, if there was more than 1 min 30 sec or not 
      { 
       $scope.data.push($scope.rawData[i]); 
      } 
     else 
      { 
       $scope.notShown.push($scope.rawData[i]) 
      } 
    } 
    //at the end of the function, we populated $scope.data with all the object with a time less than 1min 30 ago 
     $scope.updateData();//schedule the next update 
    } 
,1000); 
} 
$scope.updateData(); 

코드는이 정확한 예를위한 것일 뿐이므로 코드를 적용해야하지만 개념은 작동합니다. HTML 쪽에서는 예를 들어 두 부분으로 표시된 값, 시간 제한 내에 표시되어야하는 데이터 및 건너 뛴 데이터 (> 제한 시간)를 표시 할 수 있습니다.

Values that should be shown : 
    <div ng-repeat='values in data'> 
     {{values.time}} : {{values.content}} 
    </div> 
    <br/> 
    Values outdated : 
    <div ng-repeat='values in notShown'> 
     {{values.time}} : {{values.content}} 
    </div> 

콘솔을 보면 모든 기능 호출을 볼 수 있습니다.

이 예제에서는 제한 시간으로 1 분 30 초를 설정 했으므로 두 번째 첫 번째 개체가 표시된 목록에 30 초 동안 표시되고 31 초 후 첫 번째 개체 만 다른 1 분 동안 표시되고 그들에게 당신이 도움이

희망, 행운을 빌어 요 당신은 시간 제한을 사용하면 list 기능을 실행하는 것을 할 수

+0

각도의 $ 시계를 사용할 수 있다고 생각합니까? 나는 Json 파일을 얻을 때 아이템의 상태를 알려주는 메소드를 가지고 있는데, ng-repeat에서이 메소드를 호출하고, Json의 각 아이템에 대해 30 분 미만이면 true를 전송한다. , 그렇지 않으면 거짓. 이 메서드는 다른 메서드를 사용하여 date.now를 만들고이 Date.now를 사용하여 Json의 날짜를 확인합니다. (둘 다 타임 스탬프입니다) 그래서 $ watch를 사용하여 항목의 getStatus 메소드를 변경하거나 타임 아웃을 사용하는 것이 필수입니까? 미리 감사드립니다. – guillaumek

+0

여기서 시간 만료는 30 분을 기다리기를 원했기 때문에 예제입니다.하지만 $ watch 또는 event 일 수 있습니다. 예를 들어, $ watch 내에서'updateData' 함수를 완전히 호출 할 수 있습니다. 각각의 수정시 데이터를 다시 표시하고 숨길 수 있습니다. 실제로 함수에서 타임 아웃 부분을 삭제하면 다른 함수처럼 호출하거나 이벤트에 바인드하거나 $ watch로 호출 할 수 있습니다. – DotDotDot

+0

예를 원하면 시계를보기 위해 바이올린을 조금 수정했습니다 변수 (버튼으로 수정하지만 타임 스탬프는 괜찮습니다) : http://jsfiddle.net/DotDotDot/mgSWt/4/. 버튼을 클릭하면 변수가 변경되고 $ watch는 수정 된 것을 확인한 다음 업데이트 데이터 함수를 호출합니다. 타이밍은 동일합니다. 페이지가로드 된 후 30 초가 지나면 두 번째 항목이 표시되지 않는 목록으로 이동합니다. =) – DotDotDot

0

원하는대로 삭제// 모르도르로 전송/숨겨진해야합니다.

관련 문제