Multiple directives [myPopup, myDraggable] asking for new/isolated scope

Question

I wrote a directive for dialogs (myPopup) and another one for dragging this dialog (myDraggable), but I allways get the error:

Multiple directives [m

Answer 1

From docs:

Example scenarios of multiple incompatible directives applied to the same element include:

Multiple directives requesting isolated scope.

Multiple directives publishing a controller under the same name.

Multiple directives declared with the transclusion option.

Multiple directives attempting to define a template or templateURL.

Try removing isolate scope on myDraggable's directive:

app.directive('myDraggable', ['$document',
    function ($document) {
    return {
        restrict: 'A',
        replace: false,
        scope: { enabled: '=myDraggable' }, //remove this line

Replace scope.enabled with attrs.enabled:

if (attrs.enabled == "true") {

And modify your template to bind the enable attribute:

DEMO