Угловой UT Bootstrap Директива Typeahead создает другой элемент DOM для каждого экземпляра

Question

Я пытаюсь использовать директиву Angular UI Bootstrap Typeahead в нескольких таблицах. Эти таблицы могут содержать от 0 до тысячи записей в них, и когда я присоединяю директиву typeahead к каждому <input> в своих строках таблицы, он создает элемент DOM для каждого из них!

Если я осмотрю DOM после загрузки страницы, я вижу сотни <!-- ngIf: isOpen() --> на теле моего HTML. Дело в том, что все эти типы headheads используют один и тот же исходный список, чтобы предоставить typeahead его данные, поэтому по техническим причинам мне нужен только один элемент typeahead, который просто используется повторно для каждого входа в моих таблицах.

В настоящее время я не вижу атрибута конфигурации документации typeahead, которая позволяет нам создать 1 общий элемент типа head. Есть ли способ легко заставить эту функциональность работать без изменения самого углового бутстрапа javascript или без создания директивы typeahead с нуля?

EDIT

Чтобы сделать вещи еще хуже, я пагинацию на моих таблицах и если вы меняете между «страницами» таблиц, директива воссоздает более <!-- ngIf: isOpen() --> для каждого нового экземпляра этой страницы. Поэтому, если таблица начинается с 100 пунктов на странице из 10 страниц, если пользователь нажимает на каждую страницу разбивки на страницы за раз, в итоге они получат 1000 <!-- ngIf: isOpen() -->.

Answer 1

Внедрение какого-либо вида/изменения перехода состояния в ячейку, которая содержит директиву typeahead.

Используйте что-то вроде ng-if="row.isEditing" на вводе с директивой typeahead. As-is, ваша таблица собирается создать элемент DOM для каждой строки, если вы не скажете об этом. Когда вы нажимаете на ячейку для редактирования, затем изменяете состояние режима редактирования, а элемент DOM для typeahead будет загружаться по требованию.

Это plunker (несколько), как подход я имею в виду, но он реализует целую редактировать строку вместо: http://plnkr.co/edit/ivJQ0C

Обратите внимание, в этом примере, что элемент DOM для редактирования строки не существует, пока условие от ng-if.