Как скомбинировать шаблоны AngularJS и Thymeleaf

Question

Я конвертирую веб-страницу, в которой в настоящее время используется Thymeleaf, вместо этого используйте AngularJS.

Я хочу, чтобы преобразовать последующий блок, содержащий Thymeleaf

<form th:action="@{?deleteLog}" th:object="${log}" method="post" class="in-line"> 
    <input type="hidden" th:value="${log.vid_id}" name="vid_id" /> 
    <input type="hidden" th:value="${log.id}" name="id" /> 
    <button type="submit" class="btn btn-danger">Delete</button> 
</form> 

Эти th:value переменные передается в метод @PostMapping в моем классе контроллера затем использует эти переменные, чтобы удалить запись из моей базы данных.

Как добиться этого с помощью AngularJS? Принимая тот же подход, у меня есть

<form th:action="@{?deleteLog}" method="post" class="in-line"> 
    <input type="hidden" th:value="{{x.vid_id}}" name="vid_id" /> 
    <input type="hidden" th:value="{{x.id}}" name="id" /> 
    <input type="button" value="Remove" class="btn btn-danger" ng-click="removeRow(tableList.id)" /> 
</form> 

removeRow() функция успешно удаляет строку из таблицы в пользовательском интерфейсе, мне просто нужно отправить {{x.vid_id}} и {{x.id}} значения в метод в моем классе контроллера.

Я, очевидно, не использую правильный синтаксис, потому что я получаю ошибки синтаксического анализа для переменных tymeleaf th:value="{{x.id}}", когда я пытаюсь использовать Angular. Я также пробовал th:value="${{x.id}}"' и th:value="${{{x.id}}}".

Я не смог найти что-либо в Интернете относительно передачи угловой переменной. Возможно ли это?

Answer 1

Вы не должны смешивать AngularJS (инфраструктура SPA для HTML-шаблонов на стороне клиента) с Thymeleaf (библиотека для шаблонов HTML на стороне сервера). Вы должны выбрать шаблоны на сервере или клиенте и придерживаться его.

Сочетание этих двух не имеет смысла.