2014-09-19 105 views
2

我有接受两个函数的参数,的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' }}" /> 

在我的指导,目前,我使用的是启用/禁用特性是这样的:

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

所以基本上我的问题是如何删除enableAdd/enableRemove属性,并根据addElement/removeElement是否为null或函数来编写该逻辑。

+0

你可以这样做:'NG秀= “addEelment”',那会的工作,如果没有是因为在'addElement'函数中传递的值是未定义的,并且'ng-show'的值为false ...。 – 2014-09-19 14:52:46

+0

@MohammadSepahvand:这是一部分。那么声明该条件来设置指令的add-element属性呢? – BlueChameleon 2014-09-19 14:55:36

回答

0

你可以这样做, 在父控制器中创建两个布尔值,然后通过它们将条件传递给指令。例如:

父控制器:

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