在AngularJS中，如何确定属性是否提供给组件？

我有一个AngularJS 1.5组件，它将一个可选的回调函数作为属性绑定。我想确定是否包含该属性。在AngularJS中，如何确定属性是否提供给组件？

<silly-button></silly-button> <!-- Don't Click Me! --> 
<silly-button on-silly-click="handleClick()"></silly-button> <!-- Click Me! -->

下面给出了简单的例子，我怎么能实现的功能onClickIsNotProvided()？

angular 
    .module('example') 
    .component('sillyButton') 
    .bindings({ 
    onSillyClick: '&' 
    }) 
    .controller(['$scope', ($scope) => { 
    $scope.onClickIsNotProvided =() => { 
     // this.onSillyClick is always defined, so return value is always false :(
     return !this.onSillyClick; 
    }; 
    }]) 
    .template(` 
    <button ng-click="$ctrl.onSillyClick()"> 
     <span ng-if="onClickIsNotProvided()">Don't</span> 
     Click Me! 
    </button> 
    `);

来源

2017-05-26 Patrick McElhaney

只需使用与标准https://www.w3schools.com/jsref/event_onclick.asp不同的属性名称？ – Ioan

我已将属性名称更改为“愚蠢单击”，以避免与标准属性混淆。 –

也许是这样的？ https://stackoverflow.com/a/33935950/445600 – starcorn

您可以使用&?与=?,@?相同来标记该参数是否可选。

一些参考文献可在here中找到。虽然它没有专门讨论可选的函数绑定。

来源

2017-05-26 19:43:27 starcorn

谢谢。我发布了一个PR，在我希望在文档中找到它的地方提到该功能。 https://github.com/angular/angular.js/pull/16017 –

我认为这是一个你必须添加的功能：

function onClickIsNotProvided(item) { 

    var elementAttributeValue = item.attributes['on-silly-click'].value; 
    if (!elementAttributeValue) { 
     return true; 
    } 
    else { 
     return false; 
}

这将进入同一个地方的其他角度的控制器。

来源

2017-05-26 19:27:35 BRogers

在上面，你将传入你正在检查的元素。 – BRogers

在AngularJS中，如何确定属性是否提供给组件？

回答

相关问题