spo*_*rts 6 google-chrome angularjs ng-grid
几天前(2015年5月),谷歌Chrome发布了新版本(43.0.2357.65米).
使用此新版本,ng-grid
功能已停止工作:
症状:
单击某行时,该行不会突出显示
运行一些测试后,我设法从零重现问题:
我创造了两个掠夺者:
Plunkr 1:没有ngAnimate的应用程序
http://plnkr.co/edit/2pSBX9K0QaeaSihMKnGG?p=preview
选择行时,无论Chrome版本如何,行都会突出显示
Plunkr 2:应用程序使用ngAnimate
http://plnkr.co/edit/hyRO4fTwglSCL8KCTgHA?p=preview
选择行时,该行会在旧的Chrome版本中突出显示,但在新的Chrome版本中,这不起作用!
此外,如果您在选择一行后使用Chrome Inspector检查Plunkr 2,您可以看到该行确实获得了该类.ngRow.selected
(此类通过更改其背景颜色突出显示该行)但Chrome是一个无法直观表示该行的人改变(此类收购)
我怎么解决这个问题?任何线索?
编辑:
我创建了第三个plunkr:http://plnkr.co/edit/cWMlKEz39n8K52VWH9q8?p = preview
这是第二个plunkr的一个分支,我已经为每个没有该类的项目禁用了动画"angular-animate"
,即:
app1.config(['$animateProvider', function($animateProvider){
$animateProvider.classNameFilter(/angular-animate/);
}]);
Run Code Online (Sandbox Code Playgroud)
这有效(现在选择后会突出显示行),但如果您在应用中使用动画,这将主要打破其他所有动画!比如bootstrap-ui模态.所以,这不是一个解决方案,而是一个想法:我只需要禁用ng-grid的动画.我如何实现这一目标?
classNameFilter(x)
仅为包含其中类的项目启用动画x
.是否有类似功能禁用某些项目的动画?
尝试这个:
afterSelectionChange: function(rowItem, event) {
var x = document.querySelectorAll(".ng-scope .ngRow");
x[rowItem.rowIndex].style["webkitUserSelect"] = "none";
$timeout(function() {
x[rowItem.rowIndex].style["webkitUserSelect"] = "text";
}, 100);
}
Run Code Online (Sandbox Code Playgroud)
此修复适用于多个项目。不过请记住 DI $timeout。
归档时间: |
|
查看次数: |
597 次 |
最近记录: |