I have problem with binding. Example: In one component view I have attribute ng-click="$ctrl.onDelete" in this controller I have binding option onDelete: '&' , and in another controller view I have attribute on-delete="$ctrl.deleteSomething()" in this view controller I have function like: this.deleteSomething().
So why doesn't this stuff work. If I understand it right - When I click on "ng-click" - I call function which doesn't exist in my controller but bound to some of attribute in my app. So my click find this attribute name and call in this attribute defined function from local controller?
function CalendarSlotController($scope, $element){
}
mod.component('calendarSlot', {
bindings: {
onDelete: '&' },
controller: CalendarSlotController
});
function CalendarSlotFormController($scope, $element){
var ctrl = this;
ctrl.deleteSomething = function(){
alert(10);
var test = 2-2;
}
}
mod.component('calendarSlotForm', {
controller: CalendarSlotFormController
});
HTML:
<calendar-slot day=weekDay.name slots=$ctrl.slots>
<button ng-lick="$ctrl.onDelete">onDelete</button>
</calendar-slot>
<calendar-slot-form on-delete="$ctrl.deleteSomething()">
</calendar-slot-form>
Link to code: http://plnkr.co/edit/KpEXtgtZqEySBReV5ecq