2015-03-24 3 views
1

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

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

<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?

+0

Вы проверили [угловой раз] (https://github.com/tadeuszwojcik/angular -один раз)? Даже если это полностью не соответствует вашим потребностям, вы можете узнать, как это работает. – estus

ответ

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> 

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