扩展自定义Angular指令行为的正确方法是什么？

Question

我已经编写了自己的Angular指令<my-table>，因为我多次使用它，传入不同的数据来显示。所有表都有一个按钮，当单击时，会出现一个弹出窗体，如下所示：

但是，对于其中一个<my-table>指令，我想扩展行为，使其与其他<my-table>略有不同。例如，我们假设对于弹出的表单，当您点击Submit时会显示一个提示框，显示该<my-table>范围内的数据。

我的问题是，在仍然能够访问指令的范围的同时，扩展给定指令行为的最佳方法是什么？这是可能的，还是我只是错误地使用指令？

Answer 1

你可以做到这一点：

<my-table on-submit="doSomething(message)"></my-table>

在my-table指令定义中，您将回调绑定到范围：

scope: {
      'submit': '&onSubmit'
    },

然后在您的控制器中定义您的功能：

$scope.doSomething = function(message) {
  alert(message);
}

在您定义提交按钮的模板中，您可以执行以下操作：

<button ng-click="submit({message: 'bye!'})"></button>

您可以参考角度的文档以获取更多信息： https://docs.angularjs.org/guide/directive