如何在 AngularJS 中的 ng-repeat 填充後可靠地執行 jQuery 函數？

確保ng-Repeat 填充後DOM 操作成功

AngularJS 提供了ng-repeat 指令來迭代內容並基於以下內容生成動態內容每個項目。然而，確定 ng-repeat 產生的表的填充何時完成可能具有挑戰性。本文探討了在 ng-repeat 填充過程結束後觸發針對填充表的 jQuery 函數的方法。

使用指令

自訂指令提供了全面的解決方案ng-repeat 完成後執行函數。指令提供了一種量身定制的方法，而不是依賴 ng-Repeat 循環末尾的事件（因為每個元素都是使用自己的事件單獨創建的）。

如果需求涉及樣式化或管理事件對於整個表，封裝所有 ngRepeat 元素的指令就足夠了。相反，為了單獨尋址每個元素，可以在 ngRepeat 中使用指令，在創建後觸發每個元素的操作。

利用 ng-Repeat 屬性

AngularJS在 ngRepeat 指令中提供 $index、$first、$middle 和 $last 等屬性。這些屬性有助於根據當前元素在循環中的位置觸發事件。

考慮以下範例：

<div ng-controller="Ctrl" my-main-directive>
  <div ng-repeat="thing in things" my-repeat-directive>
    thing {{thing}}
  </div>
</div>

可以像這樣使用指令：

angular.module('myApp', [])
.directive('myRepeatDirective', function() {
  return function(scope, element, attrs) {
    angular.element(element).css('color','blue');
    if (scope.$last){
      window.alert("im the last!");
    }
  };
})
.directive('myMainDirective', function() {
  return function(scope, element, attrs) {
    angular.element(element).css('border','5px solid red');
  };
});

結論

以上是如何在 AngularJS 中的 ng-repeat 填充後可靠地執行 jQuery 函數？的詳細內容。更多資訊請關注PHP中文網其他相關文章！