Ng-repeat с дорожкой по нескольким свойствам

У меня проблема с директивой angular ng-repeat. В настоящее время я работаю над некоторым проектом, в котором из API я получаю список элементов (иногда это может быть 1k элементов), и этот список должен обновляться каждые 5 секунд (он контролирует соответствующий проект).

Когда длина списка немного больше, веб-сайт при повторном рендеринге DOM может "замедляться". Выходит, что angular регенерирует всю DOM (но 95% элемента одинаковы!)

Одним из возможных подходов является установка выражения "track by", например, item.id. Но здесь возникает еще одна проблема, я также хочу восстановить элементы, когда, например, описания были изменены другим пользователем. Поскольку track by является выражением для item.id, изменения в item.description не обновили элемент в DOM.

Есть способ отслеживать несколько свойств? Может быть, какая-то функция? Или может быть сравнение "рукой"?

Любые идеи, образцы кода, которые я бы оценил:)

UPDATE

то, что я обнаружил, когда я установил путь к item.id angular, не перекрещивался с html для элементов, просто обновлял значение в уже созданном элементе и, похоже, "быстрее", а затем удалял и создавал. Раньше я хоть немного отличался.

FIX

Для тех, кто ищет лучшую производительность более > 1k элементов в ng-repeat USE track by item.id, это повысит вашу производительность;)

Ответы

Ответ 1

Вам не нужно создавать функцию для обработки дорожки несколькими свойствами. Вы можете сделать:

<div ng-repeat="item in lines track by item.id+item.description">

Ответ 2

Как говорится в комментарии, вы можете попробовать что-то вроде этого:

<select ng-model="item" ng-options="item.id as item.description for item in items track by itemTracker(item)">

В вашем контроллере:

$scope.itemTracker= function(item) {
  return item.id + item.description;
}

Это может помочь с повторным отображением количества элементов DOM при изменении списка.

Ответ 3

Основываясь на моих знаниях, модель angularjs привязывается к представлению ui, поэтому модель будет повторно получать через $apply или $digest после изменения значения. поэтому в вашем случае u wan привязывает значение модели к представлению ui, но также не хочет повторно отображать представление, если значение не изменилось, это невозможно. это то, что я знаю.

однако, u может просто манипулировать элементом dom. например хранить данные в переменной

var x = [{id:"id1",value:"v1"},{id:"id2",value:"v2"}]

в html, вручную добавить или использовать директиву для добавления, затем назначить идентификатор элементу,

<div id="id1">v1</div>

проверить и сравнить значение, основанное на потребностях ура. после найденного, затем angular.element( "# yourid" ). text()

это решит ваши ресурсы браузера, которые будут потреблять проблемы.