Angularjs, evaluating the volume inside a style, i.e. does not work

Question

So, I basically have a div block with a style and inside that I left: {{left}} px; right: {{right}} px.
$ scope.left and $ scope.right receive an update, but this does not move my element.
Here is the fiddle

http://jsfiddle.net/climboid/5XqG7/4/

Any help is much appreciated

<div ng-app ng-controller="Controller" class="container">
  <button class="moveTo" ng-click="findPosClick()"> move to here</button>
  <div class="block" style="left:{{left}}px; top:{{top}}px;"></div>
  <div class="posTxt">left:{{left}}</div>
  <div class="posTxt2">top:{{top}}</div>
</div>

function Controller($scope) {
  $scope.findPosClick = function(){
    var location = event.target ? event.target : event.srcElement;
    var pos = $(location).position();
    $scope.left = pos.left;
    $scope.top = pos.top;
  }

}

Also, when I look at the ie9 console, I do not see the style attribute applied generally to the div ...

Answer 1

This is a known issue with IE; he will just throw out style tags that he doesn't like.

Use the directive instead ng-style.

<div ng-style="{left: left+'px', top: top+'px'}"></div>

Answer 2

style angular ({{}}). , ng-style style angular.