我有一个简单的 contactList
组件,有 2 个绑定(bind):contacts
和 onRemove
.
contacts
只是要显示的联系人数组onRemove
是一个回调函数app
.component('contactList', {
template:
`<div ng-repeat="c in $ctrl.contacts">
{{c.name}}
<div ng-click="$ctrl.onRemove({contact: c})">Remove</div>
</div>`,
bindings: {
contacts: '<',
onRemove: '&'
},
controller: function() {}
})
我在我的应用程序中多次使用这个组件。和
onRemove
回调的行为可能不同,具体取决于 contactList
的位置。组件正在被使用。例子:contactMainView
(= 组件) 使用 contactList
显示搜索栏和结果联系人列表零件。 onRemove
将从数据库中删除联系人。 groupMembersView
使用 contactList
显示属于给定组的所有联系人零件。 虽然 onRemove
在这里应该无法删除联系人。不会设置。 想法:
首先我想,我可以使用
ng-if="$ctrl.onRemove"
但这不起作用,因为 onRemove
绝不是undefined
在 contactList
内零件。 console.log(this.onRemove)
总是打印:function(locals) { return parentGet(scope, locals); }
当然我可以使用另一个
showRemove: '@'
绑定(bind),但这对我来说并不干燥。您有什么想法或更好的解决方案来完成工作吗?
最佳答案
最简单的方法是检查属性是否已定义。在您的 Controller 中注入(inject) $attrs
然后你可以这样做:
if( $attrs.onRemove ) { //Do something }
使用
&
binding angular 将包装函数以保留对原始 $scope
的引用传递的方法,即使没有定义。
关于angularjs - Angular 1.5 组件绑定(bind) : Check if Callback is Present,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38900158/