Directive scope update does not update controller scope (AngularJs)

seems to work fine You have attrs.draggableDialog set to "task.show" so when you do scope[attrs.draggableDialog] = false you end up with a element attached to scope that you could access with scope['task.show'] which is different than scope['task']['show'] or scope.task.show
To generically set a parent variable to false you need to eval a string containing the assignment. For you it would look like this:

scope.$eval(attrs.draggableDialog + ' = false;');

Does that help Let's say I have a very simple service with a few properties on it. If I use the service in a controller, put the service's properties on the scope so that they are bound to my view, and update them from the controller, they update in the view. This is the behavior I'd expect. However, if the same service's properties are modified from a directive outside of the controller's scope, the view is not updated (unless something triggers a watch to be updated in the controller's scope?). There is obviously something fundamental that I'm missing here, but search search searching has not led me to the answer. , The problem is that you're calling your service "outside" of angular:

    element.bind('click', function () {
        AuthService.login();
    });

    element.bind('click', function () {
        scope.$apply(function() {
            AuthService.login();
        });
    });

Does that help Please make sure that data object returning array of student because somtimes you have to use data.data that simple demo should helps you:
http://plnkr.co/edit/UMHfzD4oSCv27PnD6Y6v?p=preview

 $http.get('studen.json').then(function(students) {

      $scope.students = students.data; //<-students.data here

    },
    function(msg) {
      console.log(msg)
    })

To fix this issue The way you set up 2-way binding for index you could set one up for step as well? And you really do not need index to remove the item, eventhough your directive is isolated it relies on the index from ng-repeat which probably is not a good idea.

<plan-step ng-repeat="step in plan.steps" index="$index" step="step"></plan-step>

scope: {
    index: '=index',
    step:'='
 },

 return {
  template: '<button  ng-click="removeStep()">Delete step</button><br><input type="text" ng-model="step.name" />{{step}}<br><br>',
  restrict: 'E',
  scope: {
    step:'='
  },
  transclude: true,
  controller: function($scope, $element, $transclude) {
    $scope.removeStep = function() {
      $scope.$emit('removeStep', $scope.step);
    }
  }

 $scope.$on('removeStep', function(event, data) {
  var steps = $scope.plan.steps;
  steps.splice(steps.indexOf(data), 1);
});

return {
  template: '<button  ng-click="onDelete({step:step})">Delete step</button><br><input type="text" ng-model="step.name" />{{step}}<br><br>',
  restrict: 'E',
  scope: {
    step:'=',
    onDelete:'&' //Set up function binding
  },
  transclude: true
};

<plan-step ng-repeat="step in plan.steps"  step="step" on-delete="removeStep(step)"></plan-step>

this one helps. Both way works. (Directive 1-2) http://plnkr.co/edit/2kJT1mkaORsS8RUOyZ0N?p=preview
However, if u introduce isoloated scope - 2nd way do not work. (Directive 3)

  attr.$observe('attrXyz', function(value){
      console.log('4: '+ value);
  });