Expose parent scope to event handlers

[OzzieOrca]

trafficstars

This will be a contrived example but my use case is:

<div ng-repeat="question in $ctrl.questions">
    <div ng-sortable="$ctrl.sortableOptions">
        <div ng-repeat="answer in question.answers">
            {{answer}}
        </div>
    </div>
</div>

this.sortableOptions = {
    onEnd: ({ scope: { question } }) => {
       this.saveQuestion(question);
    },
};

This does feel hacky but without it, I'm not sure how to know which question had the sortable that just changed. I suppose making a nested component would make the scope available but I've got a giant component I wasn't intending on refactoring right now.

Other libraries (such as angular-ui-sortable) use attributes for event handlers where you can pass an expression from the template to do this.

I'm just trying to get off jQuery :)