AngularJS: Can't I set a variable value on ng-click?

Question

I have a modal that uses ng-show="prefs" to determine visibility.

My desire is to use the close button in the modal to set $scope.prefs to false and to use an anchor tag to set the value to true. However, all I can find on google uses a checkbox rather than anchor tags.

Is there a way to use ng-click to set a variable to false?

both inside the quotes ... that was what I was missing. Thanks! — jgravois
– jgravois, Commented Apr 17, 2014 at 18:20
I know it's exactly a year later, but you commented on your own answer, not @tymeJV's.... I thought it was funny. — taco
– taco, Commented Apr 17, 2015 at 21:42

tymeJV · Accepted Answer · 2014-04-17 18:21:05Z

96

Just do:

ng-click="prefs = false"

answered Apr 17, 2014 at 18:21

tymeJV

105k14 gold badges165 silver badges158 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

tymeJV Over a year ago

@AshokGujjar -- ng-click="prefs = false; refr = true;"

phil294 Over a year ago

this doesn't work for me, only doing it in the contorller (see msarchets answer) does it. any idea why this could happen?

Christian Nilsson Over a year ago

@Blauhirn Had the same problem. I dont know why, but when I use an object it works. ng-click="foobar.prefs = false"

tymeJV Over a year ago

@ChristianNilsson -- Probably a scope inheritance issue, read: github.com/angular/angular.js/wiki/Understanding-Scopes - it's definitely worth it.

harshad Over a year ago

@Ankita you can set it like ng-click="refr = !prefs" or ng-click="refr = prefs == true ? false : true"

|

msarchet · Accepted Answer · 2014-04-17 18:53:38Z

22

While @tymeJV gave a correct answer, the way to do this to be inline with angular would be:

ng-click="hidePrefs()"

and then in your controller:

$scope.hidePrefs = function() {  
  $scope.prefs = false;
}

answered Apr 17, 2014 at 18:53

msarchet

15.3k2 gold badges45 silver badges66 bronze badges

Comments

Prashant Pokhriyal · Accepted Answer · 2017-03-22 10:00:13Z

2

You can use some thing like this

<!DOCTYPE html>
<html>

<head>
  <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script>
</head>

<body>
  <div ng-app="" ng-init="btn1=false" ng-init="btn2=false">
    <p>
      <input type="submit" ng-disabled="btn1||btn2" ng-click="btn1=true" ng-model="btn1" />
    </p>
    <p>
      <button ng-disabled="btn1||btn2" ng-model="btn2" ng-click="btn2=true">Click Me!</button>
    </p>
  </div>
</body>

</html>

edited Mar 22, 2017 at 10:00

Prashant Pokhriyal

3,8474 gold badges33 silver badges42 bronze badges

answered Jan 24, 2015 at 7:37

Bhawna Malhotra

4905 silver badges18 bronze badges

Comments

user4148098 · Accepted Answer · 2018-06-18 03:37:02Z

1

If you are using latest versions of Angular (2/5/6) :

In your component.ts

//x.component.ts
prefs = false;

hidePrefs(){
   this.prefs = true;
}

answered Jun 18, 2018 at 3:37

user4148098

Collectives™ on Stack Overflow

AngularJS: Can't I set a variable value on ng-click?

4 Answers 4

8 Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

8 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related