AngularJS условное связывание - один раз?

В настоящее время я работаю над проектом, который должен будет отображать редактируемые таблицы произвольных размеров. Я использую AngularJS, но, поскольку таблицы могут стать очень большими, я ожидаю, что все будет медленно, если я не буду использовать какую-либо форму bind-Once. Проблема в том, что, насколько я могу судить, bind-Once является абсолютным - я хочу, чтобы он фактически сохранял или, по крайней мере, восстанавливал все наблюдатели для строк, которые в данный момент редактируются.

Вот основная идея о том, как я сейчас это делаю.

<tr ng-repeat="row in rows track by key" hackonce>
  <td ng-repeat="col in cols">
    <div ng-click="editStuff()">{{contents}}

directive('hackonce', function() etc
  link: function(scope, elem, attrs) {
    if (!scope.row.editing)
       setTimeout(function(){ scope.$destroy() }, 0)
  }

Я генерирую строковый ключ на строке из его различных идентификаторов. Когда элемент помечен для редактирования, контроллер отключает его для копирования и меняет свой ключ, чтобы включить в него то, что в конечном итоге станет данными блокировки транзакции. Это вызывает замену в ng-repeat, и в следующий раз, когда tr создается с данными замененных строк, область остается неизменной и обновляется, когда вы редактируете материал.

Так или иначе, это действительно работает (так или иначе пока). Это уменьшило меня с более чем 500 наблюдателей в небольшом списке до менее 100, и в основном это элементы управления высшего уровня, поэтому я надеюсь, что они будут хорошо масштабироваться. Похоже, что он также сохраняет и правильно очищает прослушиватели ng-click и тому подобное, хотя область действия исчезла.

Тем не менее, это тот тип хака, который я использовал, просто набрав его вкратце, и у меня возникает ощущение, что это может вызвать рвоту у здравомыслящих людей, которые знают эту библиотеку лучше, чем я. Мне было интересно, есть ли более чистый и / или более безопасный способ сделать то же самое. То, что я ищу, - это лучший способ условного связывания один раз, или элемент / область действия, иначе пропустите его $ digest для себя и всех его потомков, основываясь на каком-то выставленном флаге.

Есть ли какой-нибудь способ сделать это, который не включает в себя доставку мясорубки в прицел или ручную сборку всего мусора jQuery, которого я надеялся избежать с Angular?

1 ответ

Это довольно сложно без дополнительных подробностей реализации, но я предполагаю, что вы используете какой-то механизм, чтобы показать / скрыть доступные только для чтения / редактируемые элементы для каждой строки? Если вы используете ng-if чтобы сделать это, он прикрепит элементы к DOM и выполнит повторную привязку, когда условие true и отсоединить, когда false,

Итак, что-то вроде:

<td ng-repeat="col in cols">
  <span ng-if="!isEditing(row)">Read-only stuff here</span>
  <span ng-if="isEditing(row)">Editable stuff here.</span>
</td>

Я создал по-настоящему простой пример "plunk" здесь: http://plnkr.co/edit/SkdgTuK5UvEEsZmzWat6?p=preview

Другие вопросы по тегам