Angularjs 将自定义javascript事件绑定到

我正在开发一个移动应用程序，其中列出了一些项目。可以下拉此列表以初始化列表的刷新（我使用的是iScroll4）。我现在正尝试将此事件连接到我的angular控制器，以便可以进行api调用并更新模型

javascript基本上如下所示：

[..] //javascript code to detect the pulldown event

function pullDownAction(){
     //I want to update the scope here
}

根据我读到的内容，我需要生成一个angular指令并从那里调用事件，但我仍然没有弄清楚上面的代码应该放在哪里

我还尝试从pullDownAction函数中广播事件，并在控制器中收听，如下所示：

function pullDownAction(){
    var $rootScope = angular.injector(['ng']).get('$rootScope');
    $rootScope.$apply(function(){
          $rootScope.$broadcast('updateInbox');
    });
});

然后在控制器中：

$scope.$on('updateInbox', function(){
     $http.get(apiUrl)
         .success(function (data) {
              $scope.model = data;
        });           
});

---

但是我确信我遗漏了一些重要的东西，这使得代码无法工作。我对angular很陌生，所以我还没有真正掌握指令如何工作的窍门

在指令的link函数中，设置iScroll4插件。在链接函数中定义

pullDownAction（）

。然后，由于关闭，您将可以访问范围

app.directive('iscroll4Wrapper', function() {
    return {
       link: function(element, scope, attrs) {
          var pullDownAction = function() {
            // update scope here
          }
          $(??).iScroll4({   // I have no idea how to initialize this
            onSomeEvent: function(...) {
               pullDownAction();
               scope.$apply();  // or put this in pullDownAction()
            }
          });
       }
    }
}

---

您尝试使用注射器的方法无效，因为。

在指令的链接功能中，设置iScroll4插件。在链接函数中定义

pullDownAction（）

。然后，由于关闭，您将可以访问范围

app.directive('iscroll4Wrapper', function() {
    return {
       link: function(element, scope, attrs) {
          var pullDownAction = function() {
            // update scope here
          }
          $(??).iScroll4({   // I have no idea how to initialize this
            onSomeEvent: function(...) {
               pullDownAction();
               scope.$apply();  // or put this in pullDownAction()
            }
          });
       }
    }
}

---

您尝试的注入器不起作用，因为。

我通过将事件的所有javascript代码放在link函数中使其起作用：

app.directive('pullToRefresh', function () {
return {
    restrict: 'AC',
    link:
    function (scope, element, attr) {
            //Code to detect when element is pulled goes here

            function pullDownAction(){
                 scope.$eval(attr.pulldown);
            }

然后我在容器中放置了一个名为pulldown的属性，它们现在可以访问相同的范围。我的元素如下所示：

<div class="pull-to-refresh" pulldown="update()">
   //Element to be "pull-to-refreshable" here
</div>

//元素在此处为“可刷新”

---

update（）当然是控制器中的一个函数，您可以在其中执行任何操作

我将事件的所有javascript代码都放在link函数中，使其正常工作：

app.directive('pullToRefresh', function () {
return {
    restrict: 'AC',
    link:
    function (scope, element, attr) {
            //Code to detect when element is pulled goes here

            function pullDownAction(){
                 scope.$eval(attr.pulldown);
            }

然后我在容器中放置了一个名为pulldown的属性，它们现在可以访问相同的范围。我的元素如下所示：

<div class="pull-to-refresh" pulldown="update()">
   //Element to be "pull-to-refreshable" here
</div>

//元素在此处为“可刷新”

---

update（）当然是控制器中的一个函数，您可以在其中执行任何操作

我让它几乎按照你描述的方式工作，看我的答案！谢谢：）我让它几乎按照你描述的方式工作，看我的答案！谢谢：）