Reputation: 451
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
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