Angularjs - Function not working

Question

I am a very beginner at HTML5, CSS and Angular. I tried to write a simple code to program a button that could change the value of a boolean, just to check how the connections are done. The code is the following:

<!DOCTYPE html>
<html>
<script src= "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js">
</script>

<body>
<div ng-app="myApp" ng-controller="myCtrl">
<button ng-click="myFunction">Click Me!</button>
<br>
<p>
{{myBool}}
</p>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
    $scope.myBool = "true";
    $scope.myFunction = function() {
      if ($scope.myBool == true) {
        $scope.myBool = false;
      } else {
      $scope.myBool = true;
      }
};
});
</script>
</body>
</html>

But when I press the button, nothing happens. Can someone tell me why? Any help is welcome because, as you can see, I am quite lost.

keithm · Accepted Answer · 2015-08-23 23:25:50Z

1

You are missing () at the end of myFunction. It should be: <button ng-click="myFunction()">Click Me!</button>

Also, you have initialised $scope.myBool as a String rather than a bool: $scope.myBool = "true" should be $scope.myBool = true

answered Aug 23, 2015 at 23:25

keithm

9586 silver badges10 bronze badges

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

2 Comments

chopeds Over a year ago

Great, that worked! And how do I initialize it as a bool, @keithm ?

keithm Over a year ago

@user2211939 - use $scope.myBool = true;

Collectives™ on Stack Overflow

Angularjs - Function not working

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related