问：

我有两个单独的指令。如果某个条件被评估为我必须首先在里面调用第二个指令。true

myDirectives.directive('first', function() {
  return {
    restrict: "E",
    templateUrl: "Views/_first.html",
    require: "ngModel",
    scope: {
      functiontocall: "&",
    }
  }
});

在HTML中，我调用指令如下：

<first ng-model="model.FirstDTO" 
       functiontocall="someFunctionForAsyncData(val)"></first>

第二个指令是相同的，只是具有不同的 html 和 passed 函数。我省略了传递给指令的其他数据，这对我目前的问题并不重要。

现在，我必须首先在内部调用第二个指令，因此我添加了传递给第一个指令的附加函数：

myDirectives.directive('first', function() {
  return {
    restrict: "E",
    templateUrl: "Views/_first.html",
    require: "ngModel",
    scope: {
      functiontocall: "&",
      functionforseconddirective: "&"
    }
  }
});

我怎样才能在我的第一个指令中做出类似这样的事情，将传递给第一个指令的函数传递给另一个指令（它现在不起作用）：

<second ng-model="secondModel" 
        secondFn="functionforseconddirective(val)"></second>

只是为了说明这是这两个指令嵌套的特殊情况，我在代码中有几个地方分别调用它们，所以我想解决这种特定情况，但不影响代码中它们都正常工作的所有正常位置。

更新：jsfiddler：http://jsfiddle.net/kujg10fL/1/ 我希望单击第二个按钮显示预期的消息

angularjs angularjs angular 指令 using-directives

井。您现在确实显示了足够的信息来创建完全合格的答案。我认为是在您的控制器中定义的。这样，您就不需要将此功能从一个指令解析到另一个指令。你需要一个，你需要像这个演示小提琴一样将 from on 指令解析为足够。functionforseconddirective()triggervalue

视图

<div ng-controller="MyCtrl">
  <input href="javascript:void(0);" 
         my-directive trigger="trigger" 
         my-value="someValue" />

  <div my-other-directive 
       fn="myTriggerFunction" 
       my-value="someValue" 
       trigger="trigger"></div>
</div>

AngularJS 应用程序

var myApp = angular.module('myApp',[]);

myApp.controller('MyCtrl', function ($scope) {

    $scope.trigger = false;
    $scope.someValue = '';

    $scope.myTriggerFunction = function (value) {
      console.log(value);
    };
});

myApp.directive('myDirective', function () {
    return {
      restrit: 'A',
      scope: {
        trigger: "=",
        myValue: "="
      },
      link: function (scope, element, attrs) {
          element.on('keyup', function () {
            scope.myValue = 'hello world';
            scope.trigger = true;
            scope.$apply();
          });
      }
    }
});

myApp.directive('myOtherDirective', function () {
    return {
      restrit: 'A',
      scope: {
        trigger: "=",
        myValue: "=",
        fn: "="
      },
      link: function (scope, element, attrs) {
          scope.$watch('trigger', function (newValue, oldValue) {

            if (newValue) {

              //call controller function
              scope.fn(scope.myValue);

              //unset trigger
              scope.trigger = false;
              scope.$emit();
            }
          });
      }
    }
});

根据您的小提琴更新答案

请查看此演示小提琴。

视图

<div ng-app="dr" ng-controller="testCtrl">
    <test firstfn="someFn"></test>   
</div>

AngularJS 应用程序

var app = angular.module('dr', []);
app.controller("testCtrl", function($scope) {
    $scope.someFn = function(msg) {        
        alert(msg.msg);
    }
});
app.directive('test', function() {
    return {
        restrict: 'E',
        scope: {
            firstfn: '='
        },
        template: "<div><button ng-click='firstfn({msg:\"Hello World!\"})'>Click</button><br /> <testinner secondfn='firstfn'></testinner> </div>",
        replace: true,        
        link: function(scope, elm, attrs) {     
           console.log(scope.firstfn);
        }
    }
});
app.directive('testinner', function() {
    return {
        restrict: 'E',
        scope: {
            secondfn: '='
        },
        template: "<div>second directive<button ng-click='secondfn({msg:\"Hello World from another!\"})'>Click</button></div>",
        replace: true,        
        link: function(scope, elm, attrs) {             
        }
    }
});

functionforseconddirective（）在 BaseController 中定义。这是自动完成功能。提到的“第二个指令”是一段html，显示来自服务器的项目的下拉列表。我相信你的解决方案正在起作用，但这并不完全是我的想法。我只是简单地将函数传递给另一个指令，因此当用户键入某些内容时，另一个指令调用传递的函数，该函数调用转到服务器的 BaseController 函数。老实说，我希望有更简单的东西，没有手表和扳机。

0赞 lin 8/31/2017

@Error好的，谢谢你的反馈。那么，您希望如何使“其他指令”在没有触发器的情况下执行您传递的函数呢？这是不可能的，您需要一个侦听器/监视触发器。

0赞 lin 8/31/2017

@Error，请参阅我更新的答案和演示小提琴 ->jsfiddle.net/dxu587p1 此解决方案通过使用“按键”绑定来像魅力一样工作。我只需要更改元素和 JavaScript 事件。

0赞 Error 8/31/2017

两个指令都有模板html，我认为（如果可能的话）在第一个指令的html中添加类似“<second ng-model=”secondModel“ secondFn=”functionforseconddirective（val）“></second>”的内容，其中functionforseconddirective传递给第一个指令。在不同的html上，我传递了不同的调用函数，但是到目前为止，我一直在html中使用该指令。现在，我遇到的情况是，我必须从指令的temeplate html中使用它。

1赞 Error 8/31/2017

我添加了jsfiddler

上一个：使用 google charts 指令在 angular js 中向下钻取图表

下一个：AngularJS 中的 ng-show 和 ng-hide 用法

如何将指令内部函数传递给另一个指令

How pass function inside directive to another directive

评论

视图

AngularJS 应用程序

根据您的小提琴更新答案

视图

AngularJS 应用程序

评论