javascript - 在 ng-repeat AngularJS 中更改单击元素的工具提示
问题描述
单击元素后,我正在执行功能并在其成功后我想更改单击元素的工具提示。
我在 ngRepeat 循环中显示了多个带有此工具提示的元素。但是我只想在 currentTarget 元素(被点击的元素)上更改工具提示。目前我正在将工具提示显示为来自控制器的插值字符串,并且在函数成功后我正在更改此字符串。这导致带有此工具提示的每个元素都有新的工具提示,而不仅仅是被点击的那个。
<div ng-repeat="n in auctions">
<img src="img/heart_icon.png"
alt="Dodaj do wishlisty"
class="category__record-button--wishlist-icon"
data-ng-if="$parent.authentication.isAuth"
data-ng-click="addFollowAuction(n.id)"
uib-tooltip="{{ categoryConfig.followInfo }}"
tooltip-placement="top"
tooltip-trigger="'mouseenter'"
tooltip-append-to-body="true">
</div>
我categoryConfig.followInfo
在上面写的这个字符串也是如此,它在addFollowAuction()
函数成功后被更改:
$scope.addFollowAuction = function (auctionId) {
console.log(auctionId);
auctionsFollowService.addFollowAuction(auctionId)
.then(function (response) {
if(response.detail === 'success follow') {
$scope.categoryConfig.followInfo = 'Pomyślnie dodano ten przedmiot do wishlisty!';
}
}, function (err) {
console.log('err adding to wishlist ' + err);
});
};
然后从循环显示的所有图像都有新的工具提示信息,但我只想将新信息附加到单击的图像。我尝试使用$event
,但由于我正在改变任何一种方式,它都不起作用$scope.categoryConfig.followInfo
。
如何仅将新的工具提示信息附加到单击的元素?
解决方案
您需要 followInfo 是一个项目数组,并且每个项目都有自己的工具提示引用:
<div ng-repeat="n in auctions">
<img src="img/heart_icon.png"
alt="Dodaj do wishlisty"
class="category__record-button--wishlist-icon"
data-ng-if="$parent.authentication.isAuth"
data-ng-click="addFollowAuction(n.id)"
uib-tooltip="{{ categoryConfig.followInfo[n.id] }}"
tooltip-placement="top"
tooltip-trigger="'mouseenter'"
tooltip-append-to-body="true">
注意uib-tooltip="{{ categoryConfig.followInfo[n.id] }}"
$scope.addFollowAuction = function (auctionId) {
console.log(auctionId);
auctionsFollowService.addFollowAuction(auctionId)
.then(function (response) {
if(response.detail === 'success follow') {
$scope.categoryConfig.followInfo[auctionId] = 'Pomyślnie dodano ten przedmiot do wishlisty!';
}
}, function (err) {
console.log('err adding to wishlist ' + err);
});
};
注意$scope.categoryConfig.followInfo[auctionId]
之前不要忘记初始化followiInfo:$scope.categoryConfig.followInfo =[]
推荐阅读
- python - 如何在控制台上的打印语句附近打印 return 语句的结果?
- couchbase - 如何在 N1ql 中使用带有“光标”的分页?
- excel - 1004 将范围从一张纸复制到另一张纸时出错
- spring-batch - 为现有作业设置独立的春季批处理作业管理门户
- firebase - Firebase 身份验证:单击自定义操作链接不验证电子邮件
- java - 如何在递归实体中找到对象?
- sql - MSAccess SQL 查询 - 将所有表与多个表联合 - 重复字段
- react-native - react-native 与 expo 出错:在“Connect(App)”的上下文中找不到“store”
- kubernetes - 为什么这个 ceph pod 崩溃
- java - Spring自动装配调用错误的构造函数