文章/答案/技术大牛

发布

社区首页 >问答首页 >为什么angularjs中的ng-style不能正确运行？

问为什么angularjs中的ng-style不能正确运行？
EN

Stack Overflow用户

提问于 2020-07-23 08:57:52

回答 2查看 148关注 0票数 1

我有一个ng样式，如下图所示的ng-style

为什么count不显示3，4而显示22，23

javascript

angularjs

回答 2

Stack Overflow用户

发布于 2020-07-23 09:01:49

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>

<body ng-app="myApp" ng-controller="myCtrl">

<h1 ng-style="countStyle()">Welcome {{count}}</h1>
<h1 ng-style="countStyle()">Welcome {{count}}</h1>

<script>
var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
  
  $scope.myObj = {
    "color" : "white",
    "background-color" : "coral",
    "font-size" : "60px",
    "padding" : "50px"
  }
  var i = 2;
  $scope.count = 1;
  $scope.countStyle = function(){
    i += 1;
    $scope.count = i;
    return $scope.myObj;
  }
});
</script>

</body>
</html>

enter image description here

票数 0

Stack Overflow用户

发布于 2020-07-23 11:08:21

22 (2 + 20)

这是因为您下面的每个代码都将达到摘要循环阈值的限制，即10：

<h1 ng-style="countStyle()">Welcome {{count}}</h1>
<h1 ng-style="countStyle()">Welcome {{count}}</h1>

因为上面有2个绑定，所以它将运行摘要循环20次并中止。

尝试删除上述行中的一行，如：

<h1 ng-style="countStyle()">Welcome {{count}}</h1>

然后它将显示12。(2+10)

demo

这是因为您的方法总是在每个摘要周期中被调用，请尝试在您的$scope.countStyle方法中添加console.log。

这意味着达到了10次$digest()迭代。

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/63045268

复制

相似问题

问为什么angularjs中的ng-style不能正确运行？
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问为什么angularjs中的ng-style不能正确运行？EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问为什么angularjs中的ng-style不能正确运行？
EN