Настройка отображения поля формы Symfony2 CollectionType

Я уже некоторое время экспериментирую с формами Symfony. Без сомнения, Symfony FormType - отличная функция, которая помогает создавать надежные формы, особенно со связанными объектами (например, ManyToMany, OneToMany и т.д.). FormType делает мою работу намного менее сложной и простой, когда дело доходит до настойчивости. Одним из таких случаев является встроенные формы, где u имеет несколько (например, Category и Tag) объектов с отношением ManyToMany. Используя FormType, я могу создать поле "Выбрать выпадающее меню", используя поле формы ChoiceType, чтобы выбрать категорию, вставить другое поле CollectionType с несколькими полями "текстовый ввод", чтобы принять несколько tagname и, наконец, кнопку отправки. Все, что мне нужно, это добавить параметр cascade = {persist}, используя аннотации в свойстве categoryname объекта Category и Wallah!

Теперь, если бы я хотел создать одно поле ввода, которое может принимать несколько тегов вместо нескольких полей ввода. Вот так:

введите описание изображения здесь

Для этого я могу создать элемент <input>, используя поле формы CollectionType, а затем в моем html.twig я могу вставить javascript (jquery/AngularJS) в качестве атрибутов.

Это можно сделать, используя jquery Chosen или Select2 https://www.sitepoint.com/jquery-select-box-components-chosen-vs-select2/

или используя компонент AngularJS ngTagsInput http://mbenford.github.io/ngTagsInput/

Не только этот конкретный случай, я знаю, что jquery предоставляет почти все, что вы хотите делать на стороне клиента, и хорошо работает с Symfony, но я смотрел на AngularJS уже некоторое время, и, несомненно, это правда, что это на шаг впереди jQuery или любой другой структуры javascript. Таким образом, мое мнение немного предвзято относится к AngularJS.

Дело в том, что jquery (Chosen/Select2) использует элемент <select>, а AngularJS (ngTagsInput) использует пользовательский элемент <tags-input> для отображения этого поля. Хотя с помощью AngularJS я могу внести некоторые элементарные изменения и преобразовать элемент <tags-input> в <div ngTagsInput>, но я не могу преобразовать его в <input ngTagsInput>, потому что стандартный элемент HTML <input> не имеет закрывающего тега, поэтому многие функции, такие как auto-complete, не работают. Настройка ngTagsВключение и автозаполнение директив (AngularJS)

Проблема: Для того, чтобы Symfony сохранял ввод поля CollectionType стандартным образом, мне нужно использовать элемент <input> для отображения поля.

Вопросы:

  • Как мне сделать эту работу?

  • Насколько совместимы Symfony и AngularJS? И рекомендуется ли их использовать вместе?

Вся помощь приветствуется. Спасибо заранее!