在ng-repeat中有条件地添加一个Angular Bootstrap popover

Question

我正在使用AngularJS和Angular UI Bootstrap.

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

我做了类似这样的例子: 在plunker中的ng-repeat里面的popover例子

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

Answer 1

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

定义一个函数$scope:

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

和tdHTML:

<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>