$ parse: lexerr выбрасывается при создании html-элемента, содержащего ng-click и ссылку String в качестве параметра

Question

Я работаю над бесконечной прокруткой представления списка и создаю новые элементы списка с помощью angular.element(). Каждый элемент списка имеет свойство ng-click и в функции передается пара параметров, одним из которых является ссылка, переданная в виде строки. Поэтому angular выдает синтаксическую ошибку из-за символа двоеточия в подстроке "http:". Кто-нибудь знает, как я могу обойти эту проблему? Я пробовал разные способы исправить это, но все еще не мог решить это.

Так я создаю элемент

let newPresentationDiv = angular.element("<div role='presentation' ng-click='openArticle("+ art.source +", "+ art.id +", "+ art.image +", " + art.title +");'></div>")
$compile(newPresentationDiv)($scope) 

Это созданный HTML:

<div role="presentation" ng-click="openArticle(GI, https://www.gesundheitsinformation.de/eierstockzysten-ovarialzysten.2638.de.atom, null, Eierstockzysten (Ovarialzysten));" class="ng-scope"></div>

Это ошибка, которую я получаю

Syntax Error: Token ':' is unexpected, expecting [)] at column 22 of
the expression [openArticle(GI, https://www.gesundheitsinformation.de/eierstockzysten-ova..., null, Eierstockzysten (Ovarialzysten))]  
starting at [://www.gesundheitsinformation.de/eierstockzysten-ovarialzysten.2638.de.atom, null, Eierstockzysten (Ovarialzysten].

Я пытался поместить ссылку в " ", но она не работала. Также я попытался удалить часть строки http://, но я получаю ошибки для других символов в строке, и я предпочел бы не манипулировать самой ссылкой.

Любая помощь будет высоко ценится! Заранее спасибо :))

Answer 1

Существует проблема в способе создания шаблона.Вам нужно поставить ', чтобы отобразить его как строковое значение.

<div role="presentation" ng-click="openArticle('GI', 'https://www.gesundheitsinformation.de/eierstockzysten-ovarialzysten.2638.de.atom, null, Eierstockzysten (Ovarialzysten)');" class="ng-scope">Click me</div>

Вот демоверсия plunkr

Попробуйте

let newPresentationDiv = angular.element("<div role='presentation' ng-click=\"openArticle('"+ art.source +"', '"+ art.id +"', '"+ art.image +"', '" + art.title +"')\"></div>")