Угловая директива молча терпит неудачу (директива вынесена слишком рано?)

У меня есть приложение Angular с пользовательской директивой элемента (<uber-table>). <uber-table> предполагается взять коллекцию объектов, сделать их <table> и добавьте некоторые функциональные возможности (щелкните строку, чтобы переключить базовый объект как выбранный, окно поиска для фильтрации в реальном времени, ссылки на действия в каждой строке с настраиваемым обратным вызовом (кликами) для каждого объекта). Я создал Plunker с соответствующим кодом. Обратите внимание, что Plunker выдает ошибку о map (Object [object Object] has no method 'map'), но локально я не получаю никаких ошибок.

Функция пост-ссылки element параметр не является <uber-table> элемент, как я ожидал. Вместо этого это шаблон <div class="uber-table"> элемент. Это мешает мне извлекать данные из <uber-table>, Что я делаю неправильно? Любая помощь будет высоко ценится.

2 ответа

Вот краткое изложение некоторых вопросов.

Первая главная проблема - вы хотите, чтобы существующий контент уже находился в uber-table существует разметка, а также новый шаблон. Если не указано иное существующего контента (columns) в этом случае будут перезаписаны. Чтобы включить существующий контент в директиву с шаблоном, вам необходимо установить transclude:true затем определите в шаблоне, где этот существующий контент должен быть размещен с использованием ng-transclude на элементе, который будет родительским для содержимого.

Вот демо с исправлением transclude

Новые проблемы возникают сейчас, когда вы пытаетесь использовать JQuery для цикла columns и вернуть угловой attrs => column.attrs, Это бросает неопределенную ошибку.

Я не пытался разобраться в этом достаточно, чтобы разобраться с проблемами столбцов. Скорее всего, они должны обрабатываться по собственной директиве

ОБНОВЛЕНИЕ: вот немного исправленная безошибочная версия, использующая jQuery для анализа количества столбцов. Боюсь, меня все еще немного смущает структура этого. Я не вижу необходимости использовать jQuery для разбора столбцов, это можно преобразовать в директиву или передать определения столбцов в основную директиву из области видимости контроллера

Попробовав несколько вещей и снова посмотрев документацию, я наконец-то получил ее. Решение было поставить post-link функция внутри compile функция. Также мне пришлось обновить свою изолированную область для использования =, задавать replace в true и установить transclude в 'element',

Я обновил Plunker, если кто-то хочет увидеть изменения. Версия Plunker не работает, но, поскольку она работает локально, я не собираюсь тратить на нее слишком много времени.

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