gpt4 book ai didi

javascript - angularJS:用于溢出文本和性能的 dotdotdot

转载 作者:行者123 更新时间:2023-11-29 19:30:15 27 4
gpt4 key购买 nike

我是 angularJS 的新手,可能写了一些不好的东西......

但是我怎样才能正确实现这个插件:https://github.com/BeSite/jQuery.dotdotdot

在我的 table 上?

现在使用我的代码,我的编辑表单和表格真的不是太快......真的太慢了​​......我做错了什么?

指令:

.directive('dotdotdot', function(){
return {
restrict: 'A',
link: function(scope, element, attributes) {
scope.$watch(function() {
element.dotdotdot({watch: true, wrap: 'letter'});
});
}
}
});

和表格:

<table id="articles" class="table table-striped articles-table">
<thead>
<tr class="table-row">
<th data-ng-click="predicate = 'Date'; reverse=!reverse">Date<i ng-class="{'arrow-down' : (reverse && predicate==='Date') || (predicate!=='Date'), 'arrow-up' : !reverse && predicate==='Date'}"></i></th>
<th data-ng-click="predicate = 'Title'; reverse=!reverse">Title<i ng-class="{'arrow-down' : (reverse && predicate==='Title') || (predicate!=='Title'), 'arrow-up' : !reverse && predicate==='Title'}"></i></th>
<th data-sorter="false">article</th>
<th data-sorter="false"></th>
<th data-sorter="false"></th>
</tr>
</thead>
<tbody>
<tr data-ng-repeat="article in articles | orderBy:predicate:reverse" data-id="{{article.Id}}" class="table-row">
<td class="text-nowrap">
<div class="articles-cell">
{{article.Date}}
</div>
</td>
<td>
<div class="articles-cell article-text-area" dotdotdot>
{{article.Title}}
</div>
</td>
<td>
<div class="articles-cell">
<a href="javascript:void(0)" data-ng-click="showarticle(article)" data-toggle="modal" data-target="#new-article" class="action">
<img data-ng-src="{{article.Photo}}" data-err-src="images/no_photo.png" class="article-img img-rounded img-responsive" alt="article" />
</a>
</div>
</td>
<td>
<div class="articles-cell" dotdotdot>
<div class="content" data-ng-bind-html="article.Content" class="articles-row" ></div>
</div>
</td>
<td class="crud-arr">
</td>
</tr>
</tbody>
</table>

即使我通过绑定(bind)重写它——它也会减慢...我做错了什么?

最佳答案

正如@pankajparkar 在评论中指出的那样,这真的不应该在 $watch 中维护。这样做会在任何给定 session 中多次执行 element.dotdotdot() 配置调用——例如,每次按下某个键或单击鼠标时。部分放缓可能是插件本身以及它如何管理它所做的观看,但除此之外,您应该通过简单地删除 $watch 来看到改进:

.directive('dotdotdot', function(){
return {
restrict: 'A',
link: function(scope, element, attributes) {
element.dotdotdot({watch: true, wrap: 'letter'});
}
}
});

关于javascript - angularJS:用于溢出文本和性能的 dotdotdot,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28197197/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com