I have just started using AngularJS. I've done the tutorial from the official site.
I tried to start my own web application.

I would like to "**resize**" and "**cut**" a `div`. 

I started by trying resize `div` but the problem is the `scope` is never updated on `mouse move`. When I mousedown on `div.tool` (red div). I created a directive named `resize direct`.

I don't understand why my scope is not updated. 

**Edit : My `scope` is updated in the `console.log(...)`, but not in the view `index.html`**

Thanks 

![enter image description here](https://i.stack.imgur.com/98zzP.png)

Here is my code :

**index.html :**

```
<div class="roadmap" ng-app="dragApp" ng-controller="dragCtrl">
<div class="time">
  <div class="duree" resizedirect ng-style="{ width: myWidth }">
     <div class="tool"></div>
  </div>
</div>
</div>

```

**js/directives.js :** 

```
'use strict';

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

dragDirectives.directive('resizedirect', function() {
return {
restrict: 'A',
link: function(scope, element, attr) {
  scope.name = "Third ";
  scope.myWidth = "100px";

  var resizer = element.find(".tool")[0];
  console.log(resizer);
  resizer.addEventListener('mousedown', scope.initDrag, false);

  var startX, startY, startWidth, startHeight;

  scope.initDrag = function(e) {
     startX = e.clientX;
     startY = e.clientY;
     startWidth = parseInt(element.css("width"), 10);
     resizer.addEventListener('mousemove', scope.doDrag, false);
     resizer.addEventListener('mouseup', scope.stopDrag, false);
  }

  scope.doDrag = function(e) {
     //console.log( (startWidth + e.clientX - startX) + 'px' );
     startWidth = parseInt(element.css("width"), 10);
     scope.myWidth = (startWidth + e.clientX - startX) + 'px';
     scope.myWidth = "200px";
     console.log(scope.myWidth);
  }

  scope.stopDrag = function(e) {
      resizer.removeEventListener('mousemove', scope.doDrag, false);    
      resizer.removeEventListener('mouseup', scope.stopDrag, false);
  }

}

}
})

```

**js/app.js :**

```
'use strict';

var dragApp = angular.module('dragApp', [
  'ngRoute',
  'dragDirectives'
]);

```