AngularJS：将函数从控制器传递到指令的多种方法

Question

我正在尝试编写组件式的AngularJS，类似于这个article提出的做法。

但是，我已经意识到有各种方法可以将函数传递给相关控制器的指令。我正在处理的指令非常复杂，我通过绑定模板中的指令传递每个函数，但我现在看到我可以隐式继承$scope对象或直接引用Controller对象。

这是我的意思的一个例子：

app.js

var app = angular.module('plunker', [])

app

  .controller('myCtrl', function($scope) {
    $scope.output = '';
    // fn foo is passed into directive as an argument
    $scope.foo = function () {
      $scope.output = 'foo';
    }
    // fn inherited from controller
    $scope.bar = function () {
      $scope.output = 'bar';
    }
    // fn attached to ctrl object and referenced directly
    this.baz = function () {
      $scope.output = 'baz';
    }

  })

  .directive('myDirective', function() {
    return {
      scope: {
        output: '=',
        foo: '&',
      },
      templateUrl: 'template.html',
      replace: true,
      controller: 'myCtrl',
      controllerAs: 'ctrl'
    };
  })

的index.html

<body ng-controller="myCtrl">
  <my-directive
    output="output"
    foo="foo()">
  </my-directive>
</body>

template.html

<div>
  <button ng-click="foo()">Click Foo</button>
  <button ng-click="bar()">Click Bar</button>
  <button ng-click="ctrl.baz()">Click Baz</button>
  <p>You clicked: <span style="color:red">{{output}}</span></p>
</div>

Plunkr：http://plnkr.co/edit/1JzakaxL3D2L6wpPXz3v?p=preview

所以这里有三个函数，它们都可以工作，但是以不同的方式传递给指令。我的问题是从代码和可测试性的角度来看，每个优点是什么，哪个是最好的？