Angular: Empty Fiddle

http://angularjs.org/

HTML

<script src="http://code.angularjs.org/angular-1.0.1.js"></script>
<div ng-controller="MyCtrl">Hello, {{name}}!

    <ul>
        <li ng-repeat="x in [1, 2, 3, 4, 5]" my-directive="true" can-drag="checkPermissions(idx)">{{$parent.x}}</li>
    </ul>

</div>

CSS

[draggable]
{
    background-color: red;
    cursor: move;
}

JavaScript

var myApp = angular.module('myApp', []);


//myApp.factory('myService', function() {});
myApp.directive('myDirective', function () {
    return {
        restrict: 'A',
        scope: {
            canDrag: '&'
        },
        link: function (scope, el, attrs, controller) {
            if (scope.canDrag && scope.canDrag({idx: scope.$parent.$index})) {
                angular.element(el).attr("draggable", "draggable");
            }
        }
    };
});
function MyCtrl($scope) {
    $scope.name = 'Superhero';
    $scope.checkPermissions = function(idx) {
        console.log("checking permission for: " + idx);
        return idx % 2 == 0;
    };
}