Javascript 触发属性作为angularjs指令的函数

我已将此html模板放入fileA.directive.html中：

在我的fileB.directive.js中，我有

userForm

指令

app.directive("userForm", function() {
  return {
    restrict: "E",
    replace: true,
    templateUrl: "fileB.directive.html",
    scope: {resetUserFn: "=" },
    controller: [
       "$scope",
        function ($scope) {
          $scope.resetUserFn = function () {
             // reset goes here
          }
        }
    ]
  }

我的问题是：

如何将属性

resetUserFn

触发到我的fileB.directive.js中，并触发到我的fileA.directive.js中

任何来源或文件请

---

注意：如果可能的话，我不会使用自定义事件。

您应该创建一个公共事件，以便您可以在任何地方使用服务中的所有内容。在这种情况下，一个可以在fileA.directive.js和fileB.directive.js中使用的函数。

您应该创建一个公共函数，以便可以在任何地方使用服务中的所有内容。在本例中，一个可以在fileA.directive.js和fileB.directive.js中使用的函数。

因此您希望从父指令触发子指令的某些方法。不幸的是，AngularJS对此类问题没有本机支持。这里有一些变通方法供您考虑

使用内置的事件调度器，这是一个很好的解释

基于组件的$onChanges方法

每个角度服务都是单例服务，因此您可以创建一个用于父子通信的角度服务

每种方法都非常丑陋

事件调度器-太多的事件可能会显著降低应用程序的速度。你可能会以数百个事件结束，这些事件很难维持

$onChanges-代码看起来很难看，很难维护

每个案例都需要一个新的服务，很难维护

我想这是有原因的，为什么它不被本地支持。如果在

shoppappformcustomer

父指令下有两个或多个

指令，该怎么办？你想调用一个特殊的指令的

resetUserFn

，如何区分一个

userForm

和另一个

userForm

---

这在Angular 2及更高版本中得到了某种程度的支持，但解决方案也不完美。因此，您只需从上面选择哪种解决方案对您来说不那么痛苦并加以处理。

因此，您需要从父指令触发一些子指令方法。不幸的是，AngularJS对此类问题没有本机支持。这里有一些变通方法供您考虑

<md-button ng-click="resetForm()" class="btn btn-primary">
  Reset form
</md-button>
̶<̶u̶s̶e̶r̶-̶f̶o̶r̶m̶ ̶r̶e̶s̶e̶t̶-̶u̶s̶e̶r̶-̶f̶n̶=̶"̶"̶>̶
<user-form reset-user-fn="resetForm">
</user-form>

使用内置的事件调度器，这是一个很好的解释

基于组件的$onChanges方法

每个角度服务都是单例服务，因此您可以创建一个用于父子通信的角度服务

每种方法都非常丑陋

事件调度器-太多的事件可能会显著降低应用程序的速度。你可能会以数百个事件结束，这些事件很难维持

$onChanges-代码看起来很难看，很难维护

每个案例都需要一个新的服务，很难维护

我想这是有原因的，为什么它不被本地支持。如果在

shoppappformcustomer

父指令下有两个或多个

指令，该怎么办？你想调用一个特殊的指令的

resetUserFn

，如何区分一个

userForm

和另一个

userForm

这在Angular 2及更高版本中得到了某种程度的支持，但解决方案也不完美。所以，你只需从上面选择哪个解决方案对你来说痛苦更小，然后处理它

<md-button ng-click="resetForm()" class="btn btn-primary">
  Reset form
</md-button>
̶<̶u̶s̶e̶r̶-̶f̶o̶r̶m̶ ̶r̶e̶s̶e̶t̶-̶u̶s̶e̶r̶-̶f̶n̶=̶"̶"̶>̶
<user-form reset-user-fn="resetForm">
</user-form>

<md-button ng-click="resetForm()" class="btn btn-primary">
  Reset form
</md-button>
̶<̶u̶s̶e̶r̶-̶f̶o̶r̶m̶ ̶r̶e̶s̶e̶t̶-̶u̶s̶e̶r̶-̶f̶n̶=̶"̶"̶>̶
<user-form reset-user-fn="resetForm">
</user-form>

app.directive("userForm", function() {
  return {
    restrict: "E",
    templateUrl: "fileB.directive.html",
    scope: {resetUserFn: "=" },
    controller: function ($scope) {
        $scope.resetUserFn = function () {
            // reset goes here
        };
        $scope.$on("$destroy", function() {
            $scope.resetUserFn = null;
        });
    } 
  }        
}