AngularJS와 ng-repeat를 사용하여 효율적으로 목록을 업데이트하는 것이 가장 좋습니다.

Question

$scope.items에서 렌더링 된 항목 목록이 있다고 가정합니다. ng-repeat을 사용합니다. 이 목록은 상당히 크고 정기적으로 업데이트되지만 한 번에 하나의 항목 만 업데이트됩니다 (예 : 항목 2에 대한 12 개의 업데이트, 항목 359에 대한 2 개의 업데이트, 항목 1071에 대한 89 개의 업데이트 등이 포함됩니다.

$scope.items 목록의 단일 항목을 업데이트하면 대부분의 경우에도 AngularJS가 전체 목록을 다시 렌더링합니다. 항목이 전혀 변경되지 않았습니다. 이것은 무의미한 것처럼 보이며보다 효율적인 방식으로 확실하게 처리 할 수 ​​있습니다. jquery와 같은 도구를 사용하고 DOM을 직접 업데이트 할 수는 있지만 AngularJS의 요점을 크게 벗어나는 것 같습니다. AngularJS에서 ng-repeat 생성 모델의 단일 목록 요소를 업데이트하는 방법이 있습니까?

Answer 1

이것은 바인딩과 업데이트 설정 방법에 따라 달라집니다. 큰 목록이있는 경우 업데이트를 수행하고 서버로 보내고 전체 목록을 서버에서 반환 한 것으로 바꾸십시오. 예, 다시 렌더링 할 것입니다. 그러나 업데이트해야하는 정보 하나를 업데이트하고 해당 정보를 서버에 보내면 전체 데이터 집합을 다시 렌더링 할 이유가 없습니다.

10,000 개의 항목을 한 번에 화면에 표시하려는 경우보기 모드와 행의 편집 모드가 필요합니다. 단방향 바인딩 (https://github.com/abourget/abourget-angular)을 사용하여 읽기 전용 버전을 렌더링하고 편집 모드 인 경우 양방향 바인딩이있는 양식을 표시 할 수 있습니다. 이렇게하면 각 항목을 편집 할 수있는 동안 주어진 시간에 화면에 표시 할 수있는 항목의 수가 크게 늘어납니다.

Answer 2

내가했던 것처럼이 주제에 상륙하는 사람들에게. ngRepeat 지시어의 '추적 기준'기능을 확인하십시오.

http://www.bennadel.com/blog/2556-using-track-by-with-ngrepeat-in-angularjs-1-2.htm https://docs.angularjs.org/api/ng/directive/ngRepeat

환호