Jonathan
Jonathan

Reputation: 451

Constructors in Angularjs

I've been having a lot of problems recently trying to get my constructor work with my angular project so I created a test component. The code is supposed to toggle a message that says "hello test" by clicking a button. Please let me know why my constructor isn't responding.

<!DOCTYPE html>
  <head>
  <meta charset="UTF-8" />
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
  <script type="text/javascript" src="app.component.js"></script>
</head>
<body>
    <div ng-app="postEvent" 
        ng-controller="postCtrl">
        <button> reg button test </button>
        <button ng-click="toggle()"> toggle test </button>
        <button ng-show="state"> state test </button>
    </div>
</body>

// app.component.js
var postEvent = angular.module("postEvent", []);
postEvent.controller("postCtrl", function($scope) {        
        $scope.toggle = function () {
        $scope.state = !$scope.state; 
    }
});

Upvotes: 1

Views: 2714

Answers (1)

Sajeetharan
Sajeetharan

Reputation: 222682

Remove

function ctrl($scope) {    
}

which is unecessary here.

DEMO

<head>
<meta charset="UTF-8" />
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<div ng-app="postEvent" ng-controller="postCtrl"> <button ng-click="toggle()">test </button> <div ng-show="state" > hello test </div> </div> 
<script type="text/javascript">
    var postEvent = angular.module("postEvent", []);
    postEvent.controller("postCtrl", function($scope) {        
            $scope.toggle = function () {
            $scope.state = !$scope.state; 
        }
    });
</script>

Upvotes: 1

Related Questions