为什么在调用函数时多次打印 - AngularJS

时间：2015-06-19 03:40:41

标签： javascript angularjs function

我从控制器范围调用一个函数，但在控制台中，值打印三次。为什么会这样？

SOURCE

<!DOCTYPE html>
<html ng-app="myModule" >
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
</head>
<body ng-init="priceList='promo03,promo04'">
<div ng-controller="PricingController" >
    {{splitArray()}}
</div>
<script>
var myModule = angular.module('myModule',[]);

myModule.controller('PricingController',['$scope', function($scope){
    $scope.priceString = $scope.priceList;
    $scope.array = [];
    $scope.splitArray= function(){
        console.log($scope.priceString);
        $scope.array = $scope.priceString.split(",");
        console.log($scope.array[0]);
        console.log($scope.array[1]);
    };
}]);
</script>
</body>
</html>

CONSOLE OUTPUT

promo03,promo04 
promo03
promo04 
promo03,promo04 
promo03 
promo04 
promo03,promo04 
promo03
promo04

预期输出

promo03,promo04 
promo03
promo04

1 个答案:

答案 0 :(得分：1)

为Angular的每个摘要循环调用此方法。如果您保持程序运行，您将拥有更多日志。

要防止这种情况发生，请将您的功能调用到您的控制器中，而不是粘贴到HTML中的绑定值。

例如：

$scope.splitArray= function(){
        console.log($scope.priceString);
        $scope.array = $scope.priceString.split(",");
        console.log($scope.array[0]);
        console.log($scope.array[1]);
    };
$scope.splitArray();