javascript - AngularJS - 为价值增加价值

Question

是否可以将整数添加到范围变量？

例如

<div style="top:{{top + 140}}px">....</div>  

如果顶部是 140，它应该给我“280px”而不是“140140px”

这可能吗？

Answer 1

并不是说我认为这是最好的方法，但是您可以尝试：

<div style="top:{{top * 1 + 140}}px">....</div>  

强制 top 变为整数。

Answer 2

关于您对@Mathew Berg 的回复：

您遇到此问题的原因是因为您告诉 Angular “top”是一个字符串文字。虽然 Mathew 的方法可以将值解释为整数，但它基本上仍然是一种解决方法。@blesh 说您应该在控制器级别执行此操作是完全正确的。所以...

这

function myContoller($scope) {
    $scope.top = '1';
}
<div style="top:{{top + 140}}px"></div>
<!-- Output = <div style="top:1140px"></div> -->

还有这个

function myContoller($scope) {
    $scope.top = 'one';
}
<div style="top:{{top + 140}}px"></div>
<!-- Output = <div style="top:one140px"></div> -->

以同样的方式处理。

基本上，您无意中连接而不是预期的算术。

幸运的是，补救措施非常简单。您需要做的就是从您传递的整数中删除括号，然后 Angular 会说“嘿，这是一个数字，让我们做一些数学运算”。

eg 
function myController($scope) {
    $scope.top = 140;
}

<div style="top:{{top + 140}}px"></div>
<!-- Output = <div style="280px"></div> -->

您说“Top 在 $scope.dealer 中，我在经销商中使用 ng-repeat="d"。所以正确的是 d.top”，所以您可能需要稍微调整一下才能访问正确的范围，但该解决方案仍然适用。Angular 最棒的事情之一是它可以在其标记语法中固有地处理表达式。希望这将有助于解释导致您的问题的原因，因为 Angular 确实按照您希望的方式工作，正如它应该的那样。=)