问更改ng-重复AngularJS中单击元素的工具提示
EN

Stack Overflow用户

提问于 2018-05-21 12:01:33

回答 1查看 442关注 0票数 1

在单击element之后，我将执行函数，并在其成功之后，我想对单击元素的工具提示进行润色。

我有多个元素，在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。

如何仅将新的工具提示信息附加到单击的元素？

angularjs

tooltip

angular-ui-bootstrap

javascript

回答 1

Stack Overflow用户

回答已采纳

发布于 2018-05-21 12:11:56

您需要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);
    });
};