Angular directive parsing variables to function

Question

I have the following directive

    feedBackModule.directive("responseCollection", ['deviceDetector', function (deviceDetector) {
    return {
        restrict: "E",
        templateUrl: 'js/modules/Feedback/directives/feedbackResponse/collection.html',
        scope: {
            collections: '=',
            completeCallback: '&'
        },
        link: function (scope, element, attr) {
            scope.endCollection = function () {
                scope.completeCallback(scope.collections);
            }
        }
    };
}]);

This directive (as you can see) takes a function which is placed in the following controller:

feedBackModule.controller('FeedbackResponseController', ['$state', 'Query', 'feedbackSkillService', 'feedbackFactory', 'feedbackResponseService', function ($state, Query, SkillFactory, feedbackFactory, feedbackResponseService) {
    var num_users = null;
    var user_index = 0;
    this.activeUser = null;
    this.final = false;
    this.feedback = feedbackResponseService.getFeedback();

    this.completeUser = function (collections) {
        this.activeUser.start = false;
        if(user_index < (num_users-1)){
            user_index++;
            this.activeUser = this.feedback.feedback_has_target_users[user_index];
        }
        else
        {
            this.final = true;
        }
    }
}]);

Html:

<response-collection complete-callback="frCTRL.completeUser()" collections="frCTRL.feedback.feedback_collections" ng-if="frCTRL.activeUser.start && !frCTRL.final"></response-collection>

The function works and is correctly called however the variable i parse with it is always undefined

So my question is how can i pass a variable / object to a function like this?

Omri Aharon · Accepted Answer · 2016-03-12 12:29:51Z

1

Change the directive parameter binding to =:

completeCallback: '='

Change the HTML to reference the function (without ()):

complete-callback="frCTRL.completeUser"

And you'll be good to go.

answered Mar 12, 2016 at 12:29

Omri Aharon

17.1k5 gold badges43 silver badges61 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Marc Rasmussen Over a year ago

My i ask when i should use '&' then?

RIYAJ KHAN Over a year ago

you can not use = with function

Omri Aharon Over a year ago

@MarcRasmussen You use & when you want to bind an expression without modifications. Usually you use it when you want to invoke parameterless functions, or any other expressions.

Omri Aharon Over a year ago

@RIYAJKHAN That's not true.

Collectives™ on Stack Overflow

Angular directive parsing variables to function

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related