滚动底部 Angularjs 指令

Question

我正在开发聊天应用程序，问题似乎是滚动底部的指令，当消息中有图像时，ng-repeat 中的最后一项无法正常工作。 所以它不会一直滚动到底部。 我认为原因是指令在图像完全加载之前滚动。

                  // Scroll to bottom directive
                    .directive('schrollBottom', function ($timeout) {
                      return {
                        scope: {
                          schrollBottom: "="
                        },
                        link: function (scope, element) {
                          scope.$watchCollection('schrollBottom', function (newValue) {
                            if (newValue)
                            {
                             $timeout(function() { 

                          $(element[0]).scrollTop($(element)[0].scrollHeight);
                         }, 0, false);



                            }
                          });
                        }
                      }
                    })

Answer 1

检查 here 以了解如何在执行某项操作之前等待图像加载。您可以向所有图像添加 class 并在滚动之前等待所有带有 class 的图像加载。

我会保留您的逻辑，并将其放入 img.onload 回调处理程序中。然后任何滚动到底部只会在所有图像加载后发生。