Javascript 在具有不同控制器的视图中使用带有指令函数的ng click

我有这个html：

<button ng-click="reset()">
<div ng-controller="anotherController" class="container">
  <directive data="{{ datafordirective }}"></directive>
</div>

我的指令中有一个用于重置数据的链接函数，但问题是，我使用此按钮和此指令的视图具有不同的控制器，但指令和此视图控制器都属于同一个app.module（'appname'，[]）

有没有办法做到这一点？要在指令范围之外使用scope.reset（）函数

---

谢谢

有很多方法可以做到这一点。我将举几个例子：

1。简单（非理想）的方法

<button ng-click="buttonClicked = true">
<div ng-controller="anotherController" class="container">
  <directive data="{{ datafordirective }}" reset="buttonClicked" reset-callback="buttonClicked = false"></directive>
</div>

访问指令中的父范围：

app.directive('directive', function(){
   return {
    restrict: 'AE',
    scope:{ data: '=', someAction: '=', reset: '='},
    link: function(scope, element, attrs){
     scope.reset = function(){
        //reset dataset
     };  
  }
};

});

而不是：

scope.reset = function() {};

使用：

但是从子范围内修改父范围并不是一个好的实践。这可能会导致混淆作用域继承的工作方式（）。而且，依我看，它不是很好的封装

2。（稍微）更好的方法

<button ng-click="buttonClicked = true">
<div ng-controller="anotherController" class="container">
  <directive data="{{ datafordirective }}" reset="buttonClicked" reset-callback="buttonClicked = false"></directive>
</div>

指令将选中的

按钮的值绑定到
重置
，然后监视该值是否更改，并在更改时重置数据集

3。另一个更好的方法

<button ng-click="buttonClicked = true">
<div ng-controller="anotherController" class="container">
  <directive data="{{ datafordirective }}" reset="buttonClicked" reset-callback="buttonClicked = false"></directive>
</div>

创建一个服务来处理数据集上的操作

app.service('dataset', function() {
  this.reset = function() {
    // reset dataset
  };
});

然后，在父控制器的某个地方，您需要注入
数据集
服务，并创建一个调用
数据集的函数。重置
：

$scope.reset = function() {
  dataset.reset();
};

这将取决于您的指令是否创建隔离作用域。您可以在创建指令的位置显示JS代码吗？您可能需要将
$on
、
$emit
和
$broadcast
添加到该列表中。部分