AngularJS에서 JavaScript 클로저를 구현하는 방법은 무엇입니까? 아래 그림과 같이

Question

나는 버튼의 클릭 수를 계산하는 함수를 사용하고 있습니다 :

$scope.counterFunc = (function(){ 
    var count = 0; 
    console.log('i will be consoled only once'); 
    return function(){ 
     console.log(count); 
     return ++count; 
    } 
})(); 

보기 : 나는 count value 콘솔 수 있어요,하지만 난 그것을 어떻게 표시 할 수 있습니다

<button ng-click="counterFunc()">click me</button> 
<div> 
    {{ count value }} 
</div> 

보기에서.

이 작업을 수행하는 다른 방법이 있나요 내가 count value 바인딩 $scope 변수를 사용할 수 있습니다

을 보려면하지만 내 관심사는 count가 counterFunc()

이외의 다른 기능에 의해 변경되어서는 안된다는 것입니다? ..

Answer 1

counterFunc()은 이미 ng-click에 의해 실행될 때마다 증가 된 값을 반환합니다. 이 같은보기에 변수에 할당 할 수

count 속성은 당신의 $scope에 위의 솔루션에 의해 생성됩니다하지만 당신의 counterFunc() 내부 count 변수에서 다를 수 및 $scope.count을 변경하면 var count에 영향을 미치지 않습니다

<button ng-click="count = counterFunc()">click me</button> 
<div> 
    {{ count }} 
</div> 

하는 것으로 . 당신은 당신은 당신이 누를 때마다이 button 재설정 것을 볼 수 있습니다, 지금 $scope.count

<button ng-click="count = counterFunc()">click me</button> 
<div> 
    {{ count }} 
</div> 
<button ng-click="count = 0">Reset</button> 

의 값을 재설정 다른 button 추가하여 테스트 할 수 있습니다, 값이 0 될 것이다 표시됩니다. 그러나 click me을 다시 누르면 마지막 값인 var count부터 시작됩니다.

Answer 2

<script> 
     var app=angular.module('countButton',[]); 
     app.controller('countController',function($scope){ 
      $scope.count = 1; 
      $scope.countClick = function() { 
       $scope.count++; 
      } 
     }); 
    </script> 
    <div ng-app="countButton" ng-controller="countController"> 
     <input type="button" ng-model="count" ng-click="countClick()"> 
     <label> No of clicks </label>{{count}} 
    </div> 

보십시오.