Question

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

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

我无法弄清楚如何在指令之外有条件地设置这两个属性，以及如何在指令中有条件地使用这两个函数参数。我希望能够传递一个函数或者＃39; null＆＃39;进入指令并基于此，编写适当的逻辑内部。

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

从外部来看，目前，该指令实例化如下：

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

在我的指令中，目前，我使用启用/禁用属性，如下所示：

<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>

将条件函数参数（＆＃39;＆amp;＆＃39;）传递给自定义角度指令

1 个答案: