CODEWITHSUNDEEP
javascriptangularjs
madhu kumar
madhu kumar

Reputation: 810

how to make ngclick work like toggle?

i have taken a span and after clicking the span, it adds 1 to it. but what i need is, ngclick should add only once to whatever value is inside the span. Again for another click it should subtract 1 from it. It should not iterate continuously. i am getting {{tvshow.episode.ratings.loved}} from json data. pls help.

//html
<html>
<body>
    <span class="label likeme"  ng-click="tvshow.episode.ratings.loved = tvshow.episode.ratings.loved + 1" ng-init="{{tvshow.episode.ratings.loved}}">
        <i class="icon-thumbs-up"></i> {{tvshow.episode.ratings.loved}}</span>
</body>
</html>

Upvotes: 0

Views: 49

Answers (2)

vaibhav kulkarni
vaibhav kulkarni

Reputation: 1800

now here you have one option ng-disabled with this you can click only once.

<script>
    angular.module("my_app",[])

    .controller("my_ctr",function($scope){
        $scope.skm=true;
        $scope.mmmmmm=function()
        {

            if($scope.skm==false)
            {
                alert("first time you clicked");                
            }
            else
            {       
                alert("now you cant click");
                $scope.skm=false;
            }
        }
    })
    </script>

<body ng-app="my_app" ng-controller="my_ctr">
<button ng-click="mmmmmm()" ng-disabled="!skm">hii</button> 
</body>

Upvotes: 0

Filippo oretti
Filippo oretti

Reputation: 49817

//view.html 

<span ng-click="doOneTimeOnly();">{{tvshow.episode.ratings.loved}}</div>

//controller.js

  $scope.times = 0;

    $scope.doOneTimeOnly = function () {
      if ( $scope.times < 1) {
        //do my stuff with the tvshow.episode.ratings.loved
        //.................
       $scope.times += 1;
      }
    }

Actually i dont think this makes sense but is what you are asking for :P

this can also be easily moved to a custom directive like directive('ngOneClickOnly'); for example

Upvotes: 1

Related Questions