Question

我想要实现的是，每次点击页面中的元素时，我的div上的top和left属性都会更新，Div会使用鼠标所属的属性进行更新。

现在我不知道为什么这不起作用。

我很简单，有一个很大的div，其中有很多elementes重复点击功能。

ng-click="mapCurrentPerson($event)"

我在我的控制器中有这个函数，我记录$ event的偏移量将它绑定到变量并尝试使用ng-style属性更新页面中的变量

        $scope.currentX = 0;
        $scope.currentY = 0;

        $scope.mapCurrentPerson = function(event) {

            var x = event.offsetX;
            var y = event.offsetY;

            console.log('x: ' + x + ', y: ' + y);

            $scope.$watch('currentX', function(newValue, oldValue) {
                console.log(newValue, oldValue);
                $scope.currentX = '' + x + 'px';
            });

            $scope.$watch('currentY', function(newValue, oldValue) {
                console.log(newValue, oldValue);
                $scope.currentY = '' + y + 'px';
            });

        }

我的html需要根据点击属性更新div

<div class="current-person"
         ng-style="{'top': currentX,
                    'left':currentY}">
        <!--<img src="{{ current.photo }}" class="current-photo">-->
    </div>

$ scope.currentX和Y的开头在NG风格上运行得很好但是当我改变范围属性时它无法更新，无论我尝试什么

Answer 1

尝试使用

$scope.coordinates={};
$scope.coordinates.currentX=0;
$scope.coordinate.currentY=0;

根据offSet更改top和left属性

1 个答案: