Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/452.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript AngularJS条件绑定一次?_Javascript_Angularjs_Bindonce - Fatal编程技术网

Javascript AngularJS条件绑定一次?

Javascript AngularJS条件绑定一次?,javascript,angularjs,bindonce,Javascript,Angularjs,Bindonce,我目前正在做一个项目,需要显示任意维度的可编辑表格。我使用的是AngularJS,但是由于表可能会变得非常大,我希望如果我不使用某种形式的绑定,事情会变得很慢。问题是,据我所知,bind once是绝对的——我希望它实际上保留或至少恢复当前正在编辑的行的所有观察者 以下是我目前如何做这件事的基本想法 <tr ng-repeat="row in rows track by key" hackonce> <td ng-repeat="col in cols"> &

我目前正在做一个项目,需要显示任意维度的可编辑表格。我使用的是AngularJS,但是由于表可能会变得非常大,我希望如果我不使用某种形式的绑定,事情会变得很慢。问题是,据我所知,bind once是绝对的——我希望它实际上保留或至少恢复当前正在编辑的行的所有观察者

以下是我目前如何做这件事的基本想法

<tr ng-repeat="row in rows track by key" hackonce>
  <td ng-repeat="col in cols">
    <div ng-click="editStuff()">{{contents}}

directive('hackonce', function() etc
  link: function(scope, elem, attrs) {
    if (!scope.row.editing)
       setTimeout(function(){ scope.$destroy() }, 0)
  }

{{contents}}
指令('hackonce',函数()等
链接:功能(范围、要素、属性){
如果(!scope.row.editing)
setTimeout(函数(){scope.$destroy()},0)
}
我正在从行的各种标识符生成一个字符串键。当该项被标记为编辑时,控制器将其切换为副本,并更改其键以包含最终将成为事务锁数据的内容。这将触发ng repeat中的替换,下次使用替换的行数据构造tr时范围保持不变,并在您编辑内容时更新

不知何故,它确实有效(无论如何,到目前为止)。它将我从一个小列表中的500多个观察者降到100以下,剩下的大部分是顶级控件,因此我希望它能够很好地扩展。它似乎还能保留并适当地清理ng click侦听器,即使范围不存在了

然而,我只是简单地把它打出来就感到有点畏缩,我感觉它可能会让比我更了解这个库的理智的人呕吐。我想知道是否有更干净和/或更安全的方法来做同样的事情。我正在寻找一种更好的方法来有条件地绑定一次,或者让元素/范围therwise基于一些暴露的标志,跳过了它自己和它所有的孩子的$digest


有没有办法做到这一点,而不需要将切肉刀放到作用域中,或者手动重新附加我希望使用Angular避免的所有jQuery垃圾?

没有更多的实现细节,这有点困难,但我假设您正在使用某种机制来显示/隐藏每行的只读/可编辑元素?如果是的话如果使用
ng
执行此操作,它将把元素附加到DOM,并在条件为
true
时重新绑定,在
false
时分离

比如说:

<td ng-repeat="col in cols">
  <span ng-if="!isEditing(row)">Read-only stuff here</span>
  <span ng-if="isEditing(row)">Editable stuff here.</span>
</td>

这里是只读内容
这里有可编辑的东西。
我在这里创建了一个非常简单的示例plunk:

您检查过了吗?即使它不完全适合您的需要,您也可以从中学习它的工作原理。