Question

我试图在指令外部设置一个click函数来改变内部的东西。看起来向外传递点击功能似乎很容易，但是我需要在指令之外的事件来调用其中的函数来更新某些东西。

所以我在指令

之外有一个点击功能

  $scope.clickOutisde = function(){
    //fire event inside
 }

我想传递它（我猜）

  scope: {
      updateFn: '='
  }

关于指令本身

 update-fn="clickOutisde"

在指令控制器

中

  $scope.updateFn = function(){
    console.log("hit!");
  }

所以预期的效果是我会点击外部的函数，这将导致指令控制器内的函数触发。我知道这有点像一个奇怪的设置 - 但我想知道这样的事情是否可行（因为这不起作用）。谢谢！

Answer 1

实现目标的简单方法是使用emit/broadcast，并尝试尽可能地避开这些。

你可以做的是，有一个带有布尔值的包装器对象，并在每次触发函数时更改其值，并将该包装器对象传递给指令并对其进行监视：

控制器+指令：

myApp.directive('myDirective', function() {
    return {
        scope: {
            functionWrapper: "="
        },
        template: 'inside directive',
        link: function (scope, element, attr) {
            scope.$watch(function() {
                return scope.functionWrapper.flag;
            }, function(newVal, oldVal) {
                console.log('function fired');
            });
        }
    }
});

function MyCtrl($scope) {
    $scope.functionWrapper = { flag : false };
    $scope.func = function () {
        console.log('firing in controller');
        $scope.functionWrapper.flag = !$scope.functionWrapper.flag;
    }
}

<强> HTML：

<div my-directive function-wrapper="functionWrapper"></div>

Fiddle

Angular，在指令外部单击函数来触发一个内部

1 个答案: