将条件函数参数（'＆'）传递到自定义角度指令

Question

我有一个自定义的angular指令，它接受两个函数参数，addElement和removeElement：

.directive('myDirective', ['$window', function () {
        return {
            restrict: 'E',
            replace: true,
            scope: {
                addElement: '&',
                removeElement: '&'
            },
            templateUrl: window.root + 'myDirectiveHtml.html'
        };
    }])

我无法弄清楚如何在指令外部有条件地设置这两个属性，以及如何在指令内部有条件地使用这两个函数参数。 我希望能够将一个函数或'null'传递给指令，并在此基础上编写内部适当的逻辑。

目前，我的指令中还有两个参数（上面的代码中未列出），enableAdd和enableRemove。 我想删除这两个属性，并根据上述逻辑确定它们。

当前，从外部以如下方式实例化指令：

<myDirective add-element="addElementFunc()"
             remove-element="removeElement()"
             enable-remove="{{ 1===1 ? 'true' : 'false' }}"
             enable-add="{{ 1===1 ? 'true' : 'false' }}" />

当前，在我的指令中，我使用如下的enable / disable属性：

<div ng-show="enableAdd" ng-click="addElement()">Add</div>
<div ng-show="enableRemove" ng-click="removeElement()">Add</div>

因此，基本上我的问题是如何删除enableAdd / enableRemove属性，并根据addElement / removeElement是null还是函数来对逻辑进行编码。

Answer 1

您可以执行以下操作，在父控制器中创建两个布尔值，然后由它们将功能传递给指令。 例如：

父控制器：

$scope.triggerAdd = false;
$scope.triggerRmove = true;

父html：

  <myDirective add-element="triggerAdd ? addElementFunc() : false"
                 remove-element="triggerRmove ? removeElement(): false"
                 enable-remove="{{ 1===1 ? 'true' : 'false' }}"
                 enable-add="{{ 1===1 ? 'true' : 'false' }}" >
    </myDirective>