Question

我试图制作一个响应式固定表格标题。表头将与表格不一致;因此，我查询了原始表头并创建了我想要观察所有元素内部宽度的元素数组。

警告：我知道这是快速而肮脏的而不是棱角分明的方式，请耐心等待。

问题： 如何查看listItemHooks[i]的所有索引而不只是[0]索引？

var listItemHooks = angular.element(document.querySelectorAll('.language-header-list-items-hook'));
  $scope.$watch(function(){
    return listItemHooks[0].clientWidth
  }, function(o,v){
    console.log(o,v);
  });

Answer 1

以下情况如何？

$scope.$watchCollection(function () {
    return [].slice.call(listItemHooks).map(function (listItem) {
        return listItem.clientWidth;
    });
}, function (newWidths, oldWidths) {
    // Do something
});

当至少有一个宽度发生变化时，将调用观察者（当然是后面的范围摘要）。

Answer 2

您观看的内容必须在$ scope上，然后您需要进行深度观看。

$scope.listItemHooks = angular.element(document.querySelectorAll('.language-header-list-items-hook'));

$scope.$watch('listItemHooks', function(o,v){
  console.log(o,v);
}, true);

true作为$watch函数中的最后一个参数使得它检查对象相等，并且它变得昂贵。您还可以查看$watchCollection，我不认为这里有效，但很高兴知道。

Angular 1观察元素数组的内部键值

2 个答案: