2013-11-07 2 views
0

Если вы проверите следующий jsfiddle, вы увидите пример проблемы, которую я испытываю.Предотвращение повторной перерисовки ng-repeat всей строки

http://jsfiddle.net/Yram7/1/

Моя проблема заключается в том, что когда нг-повтор имеет очень простой тип данных вождения это такие как массив чисел, например [1..10], когда массив обновляется, angularjs каким-то образом знает valuse данные не изменились , и, следовательно, не перерисовывает строку DOM. Это означает, что части пользовательского интерфейса, такие как раскрывающийся список, могут использоваться в сочетании с setInterval, заставляя данные обновляться.

Все это хорошо.

Однако, если я изменяю структуру данных за ng-repeat, чтобы содержать сложные объекты, например [{"i" : 1}..{"i" : 10}] angularjs полностью перерисовывает строку (хотя значения НЕ ИМЕЮТСЯ, хотя, конечно, ссылки на объекты имеют), и, следовательно, если падение вниз, html уничтожается путем перекраски строки и, следовательно, плохой опыт пользовательского интерфейса, поскольку выбор пользователя не сохраняется.

Попробуйте выбрать варианты и нажмите стрелку вниз, чтобы увидеть, что я имею в виду.

Возможно ли каким-либо образом предотвратить это поведение, чтобы DOM только перерисовывал, если он обнаруживает какое-то изменение в значениях данных строки?

ответ

4

В вашей скрипке вы используете античную версию Angular. Более поздние версии имеют пункт track by в ng-repeat (docs).

Вот ваша скрипку раздвоенный, который реализует его с track by и она работает: http://jsfiddle.net/BFFJn/

Предложение track by будет ассоциироваться идентичность Итерированный объекта с DOM, так что, когда (возможно, различные) объект с тем же идентификатором , DOM обновляется, а не заменяется. Если нет track by, используется равенство объекта.

+0

Aha, я использовал трек для вложенных ng-повторов раньше, не понимал, что он может быть использован для этого также, это очень полезно, большое спасибо. – GrahamB

Смежные вопросы