在Angularjs中实现JS Pulltorefresh的问题

Question

我正在尝试使用来自这里https://ourcodeworld.com/articles/read/127/how-to-implement-a-pull-to-update-effect-android的资源将刷新刷新模块实现到我的AngularJS应用程序中-refresh-style-with-javascript

到目前为止，我将代码粘贴到控制器中，说X。

PullToRefresh.init({

        mainElement: ('#page-refresher'),

        onRefresh: function(){

            $scope.tasks();

        },

        distThreshold : 50, // Minimum distance required to trigger the refresh.

        iconArrow: '<span class="la la-arrow-down"></span>', // The icon for both instructionsPullToRefresh and instructionsReleaseToRefresh

        instructionsPullToRefresh: "Pull Down to Refresh",

        instructionsReleaseToRefresh: "Release to Refresh"

    });

上面的代码获取task（）。直到这里都没有问题。

之后，我将相同的代码粘贴到另一个控制器中，例如Y。

PullToRefresh.init({

        mainElement: ('#page-refresher'),

        onRefresh: function(){

            $scope.history();

        },

        distThreshold : 50, // Minimum distance required to trigger the refresh.

        iconArrow: '<span class="la la-arrow-down"></span>', // The icon for both instructionsPullToRefresh and instructionsReleaseToRefresh

        instructionsPullToRefresh: "Pull Down to Refresh",

        instructionsReleaseToRefresh: "Release to Refresh"

    });

现在，每当我尝试拉出控制器X的页面时，pulltorefresh函数都会起作用，并会提取task（）。然后，如果我移到另一页的控制器Y并pulltorefresh，则在这里而不是history（）来执行；之前的task（）被执行。我知道这不是在AngularJS中实现JS函数的方法。有人可以指导正确的方法，以在执行不同操作的多个控制器中实现“刷新刷新”模块。

Answer 1

PullToRefresh具有destroy方法，可用于删除其实例。在每个控制器中，您可以使用init()PullToRefresh，然后destroy()使用AngularJS$onDestroy()生命周期事件进行操作。这应避免在控制器Y中使用现有的PullToRefresh实例。这有点hacky，也许有更好的方法，但是尝试一下，看看它是否有效。控制器代码：function myController() {&nbsp; &nbsp; var self = this;&nbsp; &nbsp; var pullToRefreshInstance = PullToRefresh.init({...});&nbsp; &nbsp; self.$onDestroy = function() {&nbsp; &nbsp; &nbsp; &nbsp; pullToRefreshInstance.destroy();&nbsp; &nbsp; }}

Answer 2

使用@nevada_scout的使用destroy（）方法的答案，我尝试自己解决了这个问题，幸运的是它起作用了。if($rootScope.pullToRefreshInstance != undefined) {&nbsp; &nbsp; $rootScope.pullToRefreshInstance.destroy();&nbsp; &nbsp; $rootScope.pullToRefreshInstance = undefined;}$rootScope.pullToRefreshInstance = PullToRefresh.init({&nbsp; &nbsp; mainElement: ('#page-refresher'),&nbsp; &nbsp; onRefresh: function(){&nbsp; &nbsp; &nbsp; &nbsp; //Perform your on refresh action here&nbsp; &nbsp; },&nbsp; &nbsp; distThreshold : 50,&nbsp; &nbsp; setPassiveMode: true,&nbsp; &nbsp; iconArrow: '<span class="la la-arrow-down"></span>',&nbsp; &nbsp; instructionsPullToRefresh: "Pull Down to Refresh",&nbsp; &nbsp; instructionsReleaseToRefresh: "Release to Refresh"});将init分配给rootscope可以完成这项工作（也可以用作服务）。然后，在控制器之间移动时，代码的前3行将检查是否存在任何先前启动的ptr。如果存在，它将销毁它并创建一个特定于当前控制器的新文件。