Question

我有这个AngularJS代码：

                promise.then(function(data) {   
                    $scope.data = data;
                    $scope.hasData = (data.length > 0);

                    // Do jQuery code here
                },

如您所见，已经履行了承诺（某些API数据已完成下载）。只有一旦这个数据完成下载，我想运行一些jQuery（我希望页面在60秒内自动开始滚动到底部）。

我怎么能很好地做到这一点？我理解在AngularJS代码中包含jQuery代码并不是一个好习惯（也许是关于两者都使用美元符号的东西？）但是我不确定如何绕过它。

任何建议表示赞赏，谢谢。

编辑：

这是我将使用的jQuery代码：

        // Scroll up, then scroll down
        var intervalTime = 60000;
        $('html, body').animate({ scrollTop : 0}, 800);
        $("html, body").animate({ scrollTop: $('html, body').get(0).scrollHeight }, { duration: (0.75 * intervalTime) });

Answer 1

您可以使用ngAnimate模块：

在您看来：

<div ng-class="{scrollToBottom: promiseExecuted}">...</div>

在您的控制器中：

promise.then(function(data) {   
    $scope.data = data;
    $scope.hasData = data.length > 0;
    $scope.promiseExecuted = true;
});

然后你的动画：

app.animation(".scrollToBottom", function() {
    var intervalTime = 60000;
    return {
        addClass: function(element, className, done) {
            $("html, body").animate({ scrollTop : 0 }, 800);
            $("html, body").animate({ scrollTop: $("html, body").get(0).scrollHeight }, { duration: (0.75 * intervalTime) });
        }
    };
});

如何在AngularJS中运行jQuery代码？

1 个答案: