如果列文本在角度视图中太长,则将其放在工具提示中

时间:2013-01-28 12:29:30

标签: javascript html angularjs

我在我的htm页面中有一个使用AngularJs的列表。

如果列中的文字超过8个字符

,我想将文本放在工具提示中

这是我的专栏:

<td>
<i class="column3">
    {{stoneEntity.StoneProperties.StockId}}
</i>
</td>

1 个答案:

答案 0 :(得分:3)

使用如下指令:

app.directive('showTooltip', function() {
    var MAX_SIZE = 8;
    return {
        restrict: 'A',
        scope: { label: '=showTooltip' },
        link: function (scope, element, attrs) {                        
            if ((scope.label || '').length > MAX_SIZE) {                
                element.text(scope.label.substring(0, MAX_SIZE));
                element.attr('title', scope.label);                
            } else {
                element.text(scope.label);
            }
        }
    }
});

注意:为简单起见,MAX_SIZE正在指令中定义,但您可以更改它并接收最大尺寸作为参数。

jsFiddle http://jsfiddle.net/bmleite/h5Np6/