간격이있는 $ http-call의 변경 사항을 감지하는 ngAnimate

Question

몇 개의 항목이있는 배열이 있습니다. x 초마다 최신 데이터가 포함 된 새로운 배열이 나타납니다. 데이터가 변경된 경우 나는 확인하고,이 경우, 나는 새 것으로 이전 대체 :

if (currentList != responseFromHttpCall) { 
    currentList = responseFromHttpCall; 
} 

나는 모두를 교체 것처럼 역할로이, 겨 - 애니메이션에서 제공하는 클래스를 망쳐 놨을 items - 글쎄, 나는 실제로,하지만 어떻게 해야할지 모르겠다.

이러한 변경 사항은 목록에 발생할 수 있습니다

이

1. 목록에서 하나 (또는 ​​그 이상)의 새 항목 (들)있다 -하지 necessaryly 목록의 끝에서하지만.
2. 목록에있는 하나 이상의 항목이 사라 졌거나 삭제되었을 수 있습니다.
3. 하나 이상의 항목이 변경 될 수 있습니다.
4. 두 개 이상의 항목이 서로 바뀌었을 수 있습니다.

누가 어떤 수업을 보여줄지 이해하는 데 도움이 될만한 사람이 있습니까? 나는 여기에서 찾아낸 나의 문제의 작은 "illustation"를 만들었다 : http://plnkr.co/edit/TS401ra58dgJS18ydsG1?p=preview

고맙습니다.

Answer 1

원하는 것을 얻으려면 컨트롤러의 기존 목록 (vm.list)을 모든 작업마다 수정해야합니다. 나는 당신의 구체적인 예를 위해 일할 수있는 하나의 솔루션을 가지고있다.

newList.forEach((val, index)=>{ 
    // some code to check array on controller 
}); 

: 당신이 (당신의 사건 newList에) 다른 목록에 대해 반복해야합니다 추가의 경우

vm.list.forEach((val, index)=>{ 
    // some code to check against array that's coming from ajax call 
}); 

:

과 유사한 (첫째을 통해 루프) 2 개 목록을 비교해야

저는 이것이 최선의 해결책이라고 말하지는 않지만 작동하며 작동 할 것입니다. 명심하십시오 - 올바르게 변경하기를 원한다면 우리가 변경하지 않았기 때문에 앱 사이클 전반에 걸쳐 동일한 데이터를 유지할 동일한 글로벌 original 목록을보고 있기 때문에 각 조치 후에 재설정을 클릭해야합니다 각 기능의 종료 전에 :

original = angular.copy(vm.list); 

또한이 더 일반적인 만들 수있는 하나 개의 기능에 모든 것을 넣어하지만, 예를 들어, 여기 plnkr는 다음과 같습니다

http://plnkr.co/edit/sr5CHji6DbiiknlgFdNm?p=preview

는 도움이되기를 바랍니다.