CODEWITHSUNDEEP
angularjsangularjs-directive
David
David

Reputation: 3614

undefined value for parameter in directive using controllerAs

I'm almost too embarrased to ask this, but after hours trying I can´t find the cause for this issue.

Simple directive, just passing a parameter one-way. If I use $scope in the controller the parameter's value is in there, but when I switch to controllerAs and bindToController to get rid of $scope, then the parameter is undefined.

This is my code and also the fiddle.

<my-directive param="foo"></my-directive>

angular
    .module("app",[])
    .directive('myDirective', myDirective);

function myDirective() {
    return {
        restrict: 'E',
        scope: {
            param: '@'
        },
        controller: function() {
            var vm = this;
            vm.foo = vm.param + ' foo2';
        },
        controllerAs: 'vm',
        bindToController: true,
        template: '{{vm.foo}}'    
    }
}

What am I doing wrong? Many thanks,

Upvotes: 2

Views: 429

Answers (1)

Simon H
Simon H

Reputation: 21005

I believe you are using out of date syntax - bindToController has changed - see below

function myDirective() {
    return {
        restrict: 'E',
        // **********************
        scope: {},
        bindToController: {
            param: '@'
        },
        controller: function() {
            var vm = this;
            vm.foo = vm.param + ' foo2';
        },
        controllerAs: 'vm',
        template: '{{vm.foo}}'    
    }
}

Upvotes: 1

Related Questions