angularjs – 在ng-repeat中有条件地添加Angular Bootstrap popo

发布时间：2020-12-17 17:56:14 所属栏目：安全来源：网络整理

导读：我正在使用AngularJS和Angular UI Bootstrap. 在我的模板中,我需要显示一个表,我用ng-repeat创建它,我需要在点击时为某些单元添加一个弹出框. 我做了类似这样的例子： popover example inside ng-repeat in plunker 如何仅在某些单元格中有条件地使用弹出窗

我正在使用AngularJS和Angular UI Bootstrap.

在我的模板中,我需要显示一个表,我用ng-repeat创建它,我需要在点击时为某些单元添加一个弹出框.

我做了类似这样的例子：
popover example inside ng-repeat in plunker

如何仅在某些单元格中有条件地使用弹出窗口？

解决方法

检查工作演示： Plunker.只有值为>的单元格5.0将显示弹出窗口(绿色背景色).

在$scope上定义一个函数：

$scope.filterCells = function (v) {
    return v > 5.0 ? 'mouseenter' : 'none';
};

和td HTML：

<td data-ng-repeat="v in getRowData(row)" class="zscore" 
    ng-class="{'show-popup': filterCells(v)}" popover="{{zscores[row][$index]}}" 
    popover-trigger="{{ filterCells(v) }}" 
    popover-append-to-body="true" popover-title="zScore">
    {{ v | number:1 }}
</td>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!