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

Question

我有两个独立的指令。如果某些条件被评估为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和传递函数。我省略了传递给指令的其他数据，这对我当前的问题并不重要。

现在，我必须先调用第二个指令，所以我添加了传递给第一个指令的附加函数：

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/ 我希望点击第二个按钮显示预期的消息

Answer 1

好。您现在显示了足够的信息来创建完整的合格答案。我认为你的控制器中定义了functionforseconddirective()。这样，您就不需要将这个功能从一个指令解析到另一个指令。您需要一个trigger，并且您需要解析来自指令的value，以便像 demo fiddle 中那样进行接触。

视图

<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();
            }
          });
      }
    }
});

根据您的小提琴更新答案

请检查 demo fiddle 。

视图

<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) {             
        }
    }
});