Задание имени угловой директивы через значение модели

0

У меня есть цикл, основанный на значении, мне нужно указать конкретную директиву. Вот что у меня есть:

<div ng-repeat="w in row.widgets" class="col-md-{{12/row.widgets.length}}">
                    <{{w.type}}>
                    </{{w.type}}>
                </div>

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

<widget-directive-one>
<widget-directive-two>
<widget-directive-three>

Я не понимаю, почему вместо того, чтобы выводить фактическое значение, он не будет вызывать директиву с тем же именем. Любой совет будет очень благодарен!

Теги:
angular2-directives

4 ответа

0

Используйте директиву ng-bind-html:

Из Документов:

ngBindHtml

Вычисляет выражение и вставляет полученный HTML-код в элемент безопасным способом.

Вы также можете обойти санитарию для ценностей, которые, как вы знаете, безопасны. Для этого свяжите с явно доверенным значением через $ sce.trustAsHtml. См. Пример под строгим контекстным экранированием (SCE).

- Справочник по API-интерфейсу AngularJS ng-bind-html

0

используйте этот ng-if

<div ng-repeat="w in row.widgets" class="col-md-{{12/row.widgets.length}}">
    <widget-directive-one ng-if="$index==0"></widget-directive-one>
    <widget-directive-two ng-if="$index==1"></widget-directive-two>
    <widget-directive-three ng-if="$index==2"></widget-directive-three>
</div>
0

Добавьте widgetType в область вашего контроллера $. Тогда вы можете сделать что-то вроде этого:

<div ng-switch="widgetType">
  <widget-one ng-switch-when="widgetOne"></widget-one>
  <widget-two ng-switch-when="widgetTwo"></widget-two>
  <widget-three ng-switch-when="widgetThree"></widget-three>
</div>
0

Имена атрибутов и имена тегов не могут быть динамически генерированы в самом теле (представления).

Угловой должен иметь возможность анализировать элементы в dom и сравнивать существующие имена тегов или атрибуты с этими директивами

Существует множество способов приблизиться к этому... ng-switch, ng-if или настраиваемой директиве, которая возвращает требуемый тег директивы, это несколько примеров

Ещё вопросы

Сообщество Overcoder
Наверх
Меню