Javascript 使用图像生成网格和自定义指令

我们在ng网格和指令方面遇到了相当大的问题

基本上我们有一个ng网格，我们有一个提供图像的指令

我们所做的：-

创建了一个显示图像的简单指令 问题：-在滚动图像时，图像往往会上下跳转到不同的行上

在谷歌搜索了很多之后，我们发现我们应该使用$watch语句， 所以现在我们的指令看起来像：-

MyLists.directive（'status'，function（）{
返回{
限制：'E'，
替换：正确，
模板：“”+
'' +
'' +
'',    
作用域：{alertData:'=alertData'}，
链接：函数（作用域、元素、属性）{
函数更新警报（stralert）{
scope.alert=“”；
如果（（stralert！==null）&&（stralert！==未定义）&&&（stralert！==null））{
scope.alert=stralert；
}
返回scope.alert；
}//函数
作用域.$watch（'alertData'，函数（oldValue，newValue）{
如果（新值）{
UpdateCalert（范围.alertData）；
}
});           
}           
}
});

现在，这至少可以阻止图像跳行，但新问题是：-

网格现在突然运行得非常慢，单击列标题（用于排序）也在复制数据

---

我们是否遗漏了一些信息？

为什么要使用指令来显示图像？使用单元格模板不是更容易吗？@main guy我们正在使用该指令，因为我们在其中的两个模板中有逻辑，可以根据范围值显示某些图像扫描您可以向我展示更多的实现吗？如何定义网格？什么是ictrl？？您的网格中有多少数据？数据是什么样子的？因为你的指令在这里运作良好。没有延迟，没有重复。请检查如果在观察程序中忽略if（newValue），会发生什么。

MyLists.directive('status', function () {
    return {
        restrict: 'E',
        replace: true,
        template: '<div ng-switch="alert">' +
                    '<div ng-switch-when=""></div>' +
                    '<div ng-switch-default><img src="{{alert}}.ictrl" /></div>' +
                  '</div>',    
        scope: { alertData: '=alertData' },        
        link: function (scope, element, attrs) {            
            function updateICAlert(stralert) {
                scope.alert = "";
                if ((stralert !== null) && (stralert !== undefined) && (stralert !== '')) {
                    scope.alert = stralert;
                }
                return scope.alert;
            } //function    
            scope.$watch('alertData', function (oldValue, newValue) {                
                if (newValue) {
                    updateICAlert(scope.alertData);
                }
            });           
        }           
    }
});