使用 AngularJS 增加 CSS 偏移量答案

【问题标题】：CSS offset increments with AngularJS使用 AngularJS 增加 CSS 偏移量
【发布时间】：2013-11-14 18:15:57
【问题描述】：

在我的 Angular 应用程序中，我有一个 div，每次调用 slideThis() 函数时，我希望其左偏移增加 90px。在 jQuery 中，我会通过指定 left: '+=90' 之类的东西来做到这一点，但是据我所知，在 AngularJS 中似乎没有等效或可比的方法 - 还是我遵循了完全错误的方法？

HTML：

<div ng-style="myStyle"></div>

JS：

$scope.slideThis = function() {
    $scope.myStyle = {
        left: '+=90'
    }
}

非常感谢有关如何进行此类操作的任何建议！

【问题讨论】：

myStyle 需要返回style="...." 中使用的有效样式语法。不清楚您要添加什么。

标签： javascript jquery html css angularjs

【解决方案1】：

您可以执行类似的操作，让您的控制器跟踪位置并相应地更新样式。

HTML：

<input type="button" value="Move" ng-click="slideThis()"> 
<div ng-style="myStyle">Stuff to move</div>

控制器：

myApp.controller('MyCtrl', function ($scope) {    

    var pos = 0;
    $scope.slideThis = function() {
       pos += 90;

       $scope.myStyle = { 
          position: 'absolute',
          left: pos+'px'
    }
  };
});

显然，您可以使用相同的方法使用边距或内边距。

在这里演示：http://jsfiddle.net/zKRLs/3/

【讨论】：