У меня есть цикл, основанный на значении, мне нужно указать конкретную директиву. Вот что у меня есть:
<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>
Я не понимаю, почему вместо того, чтобы выводить фактическое значение, он не будет вызывать директиву с тем же именем. Любой совет будет очень благодарен!
Используйте директиву ng-bind-html
:
Из Документов:
ngBindHtml
Вычисляет выражение и вставляет полученный HTML-код в элемент безопасным способом.
Вы также можете обойти санитарию для ценностей, которые, как вы знаете, безопасны. Для этого свяжите с явно доверенным значением через $ sce.trustAsHtml. См. Пример под строгим контекстным экранированием (SCE).
используйте этот 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>
Добавьте 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>
Имена атрибутов и имена тегов не могут быть динамически генерированы в самом теле (представления).
Угловой должен иметь возможность анализировать элементы в dom и сравнивать существующие имена тегов или атрибуты с этими директивами
Существует множество способов приблизиться к этому... ng-switch
, ng-if
или настраиваемой директиве, которая возвращает требуемый тег директивы, это несколько примеров