Блог

Главная - Вопросы по программированию - Директива Angular, которая будет работать как макрос lisp, но для html

Директива Angular, которая будет работать как макрос lisp, но для html

#angularjs

#angularjs

Вопрос:

Могу ли я иметь в директиве то же самое, что и в макро lisp, где я могу получить доступ к исходному html внутри элемента и на основе его html создать новый html, который будет введен в DOM?

И я получаю доступ к html внутри и создаю новый шаблон на основе этого html.

Возможно ли преобразование html -> html в Angular? Из того, что я прочитал, это не так, но, возможно, есть какое-то расширенное использование фреймворка, которое позволит это.

Например, у меня есть такой код:

 <directive>
   <ul>
      <li>Foo</li>
      <li>Bar</li>
   </ul>
</directive>

и какой вывод:

 <directive>
   <ul>
      <li ng-hide="some-logic">Foo</li>
      <li ng-hide="some-other-logic">Bar</li>
   </ul>
</directive>

Итак, что мне нужно, так это функция шаблона, которая получит html в качестве аргумента и вернет шаблон, который будет иметь код angular.

 template: function(source_xml) {
   return source_xml.find('li').each(function() {
     $(this).attr('ng-hide', '<SOME LOGIC>');
   });
}

Есть способ использовать $compile внутри функции transclude, но я не совсем уверен, как его использовать и будет ли он работать так, как я думаю.

Комментарии:

1. Я не понял ни слова 🙂 Не могли бы вы привести пример (например, «этот ввод должен выдавать этот вывод»)?

2. @ExpertSystem обновил вопрос

3. В некотором смысле директивы сами по себе являются макросами, которые вы ищете. Более ориентированным на angular способом выполнения вашего примера было бы создать директиву для этих <li> узлов и поместить любую логику, которую вам нужно установить ng-hide для этих элементов в этой директиве. (т. Е. Вместо того, чтобы думать в терминах поглощения целого фрагмента HTML и использования .find() для поиска его фрагментов для преобразования различными способами, подумайте в терминах использования отдельной директивы для каждого бита и фрагмента, которые нуждаются в преобразовании, и вложения этих директив там, где это необходимо.)

4. @DanielBeck проблема, которую я пытаюсь решить, заключается в том, что мне нужно ввести (преобразовать) в 2 места, и в одном месте должен быть ng-hide (в общем, внутри должны быть разные угловые элементы). Я мог бы использовать hide() (и использовать логику jQuery), но я могу получить доступ к элементам, если есть ng-repeat.

5. @jcubic Я думаю, вам было бы лучше опубликовать новый вопрос, более специфичный для любого результата, которого вы пытаетесь достичь; действительно сложно дать вам хорошие рекомендации без каких-либо подробностей. В целом, однако, angular может выполнить за вас гораздо больше работы, если вы позволите: подумайте об отдельных компонентах, каждый из которых является собственной директивой, вместо того, чтобы иметь одну директиву сверху вниз, которая пытается обработать все. (И почти никогда не рекомендуется прибегать к прямым манипуляциям с DOM через jQuery или иным способом; это обычно приводит к конфликтам с Angular.)