2017-12-12 3 views
0

ich eine Funktion bin mit der Anzahl der Klicks auf die Schaltfläche zählen, wie unten dargestellt:Wie können JavaScript-Verschlüsse in AngularJS implementiert werden?

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

Ansicht :

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

ich in der Lage bin, die count value zu trösten, aber wie kann ich es zeigen in der Ansicht.

I $scope Variable verwenden count value zu binden zu sehen, aber meine Sorge ist, dass die count sollte nicht durch eine andere Funktion außerhalb der counterFunc()

verändert werden Gibt es eine andere Möglichkeit, dies zu tun? ..

Antwort

1

Ihr counterFunc() gibt den erhöhten Wert bereits bei jeder Ausführung durch ng-click zurück. Sie können es wie folgt auf eine Variable auf Ihrer Ansicht zuweisen

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

Beachten Sie, dass count Eigenschaft wird durch obige Lösung in Ihrem $scope erstellt werden, aber das wird von count Variable in Ihrem counterFunc() unterschiedlich sein und $scope.count ändern, beeinflussen nicht var count . Sie können dies testen den Wert von $scope.count

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

nun einer anderen button durch Zugabe zum Zurücksetzen, werden Sie sehen, dass jedes Mal, wenn Sie button drücken Reset, angezeigt Wert 0 werden wird. Wenn Sie jedoch erneut click me drücken, beginnt der letzte Wert von var count.

-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> 

Versuchen Sie diese.

+0

OP ist spezifisch für das Hinzufügen von 'count' in' $ scope' –

Verwandte Themen