AngularJS: how do I create custom directive that takes in a parameter?

Question

I want to create a custom directive that is an attribute that requires an attribute value similar to how ng-repeat takes a list of items. For example,

<div myDir="{{someList}}"></div>

How is this done?

Answer 1

You should do it like this

app.directive('myDir', function () {
    return {
        scope: {
            'myDir' : '@', //'@' for evaluated value of the DOM attribute, 
                           //'=' a parent scope property
        },
        link: function (scope, element, attrs) {
            scope.$watch('myDir', function (newVal) {
                console.log('myDir', newVal);
            });
        }
    };
});

usage for evaluated value (with '@')

<div my-dir="{{someList}}"></div>

usage for property from a scope (with '=')

<div my-dir="someList"></div>

to understand difference between '@' and '=' look here