Я делаю приложение для тележки в Угловом, используя Angular Bootstrap.Угловая бутстрап Подсказка Динамический контент
При наведении указателя мыши на значок корзины должна появиться всплывающая подсказка. Содержимое всплывающей подсказки должно изменяться в зависимости от того, находится ли элемент в корзине или нет.
Итак, вот HTML:
<h3><i class="fa fa-shopping-basket" ng-click="add2Cart(item.Name)" tooltip-placement="right" uib-tooltip-html="itemtooltiptext(item.Name)" aria-hidden="true"></i></h3>
В основном, для того, чтобы проверить, если элемент уже в корзине, я хочу, чтобы текст всплывающей подсказки, чтобы решить из функции. Мое понимание из документации - это поддерживается, пока HTML доверен.
Он говорит,
uib-tooltip-html
$ - принимает выражение, которое вычисляется в HTML строку. Обратите внимание, что этот HTML не компилируется. Если требуется компиляция, используйте вместо этого параметр атрибута uib-tooltip-template. Пользователь несет ответственность за обеспечение безопасного хранения содержимого в DOM!
Так что моя itemtooltiptext()
функция ...
$scope.itemtooltiptext = function(name) {
if (localStorage.getItem("cart") === null) {
return $sce.trustAsHtml("Add " + name + " to Cart!");
} else {
var cart = JSON.parse(localStorage.getItem("cart"));
for (var i = 0; i < cart.length; i++) {
if (cart[i] == name) {
console.log("already in cart");
return $sce.trustAsHtml(name + "already in Cart!");
}
}
return $sce.trustAsHtml("Add " + name + " to Cart!");
}
}
Это приводит к ошибке
Бесконечные $ дайджеста Loop
Как подробно описано здесь: https://stackoverflow.com/a/19370032
Но проблема в том, что мне нужно, чтобы она исходила от функции с различными условиями? Так должен ли я использовать шаблон? Я не понимаю, как это будет работать лучше, потому что мне по-прежнему нужен динамический текст из шаблона ... так что же такое решение?
спасибо.
вы можете составить [шлепнуть] (https: // plnkr .co /)? – svarog