Angular-动态工具提示内容

Question

我有以下问题：我想通过使用带参数的函数动态地将内容提供给工具提示。 这里的关键是参数具有我需要更改工具提示内容的信息，因为此工具提示位于ng-repeat指令中。

我的html有点：

<div class="module-box highlight clearfix" ng-repeat="request in model.requests.items track by request.id" ng-class="{ 'inactive-section': model.isLoading.value }">
    ...
        <div class="module-column text-center">
                    <h5>REQUEST STATUS</h5>
                    <p>
                        <span data-toggle="tooltip" uib-tooltip="{{request.requestStatus.name}} {{someFunction(request)}}">
                            <i class="fa fa-clock-o fa-lg {{request.requestStatusGroupCssClass}}" aria-hidden="true"></i>
                        </span>
                    </p>
                </div>
    ...
</div>

该html视图具有自己的指令，称为homePendingRequests.js。 然后，将视图插入到Home.html页面（具有它的控制器）中。

谢谢！！

Answer 1

我刚刚解决了。 它很甜蜜

html指令：

<div class="module-column text-center">
    <h5>ESTADO</h5>
    <p>
        <div ng-mouseenter="tooltipHelper(request)">
            <span data-toggle="tooltip" uib-tooltip="{{msg}}">
                <i class="fa fa-clock-o fa-lg {{request.requestStatusGroupCssClass}}" aria-hidden="true"></i>
            </span>
        </div>
    </p>
</div>

js指令：

    $scope.tooltipHelper = function (request) {
        $scope.msg = request.requestStatus.name;
        if (request.validatorsForPendingStatus) {
            $scope.msg += ' (' + request.validatorsForPendingStatus.validatorsList + ')';
        }
    };

Answer 2

use $copmile(`<div class="module-box highlight clearfix" ng-repeat="request in model.requests.items track by request.id" ng-class="{ 'inactive-section': model.isLoading.value }">
    ...
        <div class="module-column text-center">
                    <h5>REQUEST STATUS</h5>
                    <p>
                        <span data-toggle="tooltip" uib-tooltip="{{request.requestStatus.name}} {{someFunction(request)}}">
                            <i class="fa fa-clock-o fa-lg {{request.requestStatusGroupCssClass}}" aria-hidden="true"></i>
                        </span>
                    </p>
                </div>
    ...
</div>`)($scope)