DOM更新事件后的AngularJ

deikduxw  于 2022-10-24  发布在  Angular
关注(0)|答案(1)|浏览(151)

在我的angularJs控制器中,我需要从控制器初始化的服务器加载一些图像

$http({
        method: 'GET',
        url: $scope.baseUrl + '/edit/' + $scope.idScheda
    }).then(function (response) {
        $scope.scheda = response.data;

        //JQuery initialization

    }).catch(function (error, status) {
        $scope.show_error_message("Error", error.data.message);
    });

然后,我需要调用jQuery函数将新上载的图像初始化为幻灯片

var swiper = new Swiper(".mySwiper", {
                loop: true,
                spaceBetween: 10,
                slidesPerView: 4,
                freeMode: true,
                watchSlidesProgress: true,
            });
            var swiper2 = new Swiper(".mySwiper2", {
                loop: true,
                spaceBetween: 10,
                navigation: {
                    nextEl: ".swiper-button-next",
                    prevEl: ".swiper-button-prev",
                },
                thumbs: {
                    swiper: swiper,
                },
            });

如果我在$http Promise的“Then”事件中运行此代码,则DOM仍不会更新,JQuery也不会工作。
如果我延迟初始化JQuery组件以确保DOM更新,这个问题就会消失,但这个解决方案非常糟糕!
有没有一个由AngularJS管理的事件可以在DOM更新后触发?

lymgl2op

lymgl2op1#

$http执行以下操作:
1.运行http请求
1.运行你的then区块
1.运行digest
您希望在#3之后运行jQuery代码,因此只需使用原生setTimeout(..., 0)$timeout(..., 0)将其排队
附注:您的正常angularjs代码不应该为t使用难看的jQuery-create指令/组件,如

<div cool-swiper="..."></div>

在onChanges中,您可以像以前一样运行超时的jQuery插件。

相关问题