Geek Answers Handbook

Simple ng-click does not work in typescript

I am trying to call a function in the click function on my html page, added all typescript definition files from nuget, but something is wrong. My click function does not work .... Error in console even

Here is my Hrml and Controller code

Html Page

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">


<head>
    <script src="Scripts/angular.js"></script>

    <script src="test.js"></script>
    <title></title>

</head>
<body ng-app="testModule">
    <div ng-controller="test">
        <input type="button" ng-click="click()" value="test" />
    </div>
</body>
</html>

controller

angular.module("testModule", []);

class test {

    constructor() { }

    click() {

        alert();
    }
} 


angular.module("testModule").controller("test", test );
+4
source share
2 answers

This does not work because it is ng-click="click()"trying to call $scope.click(), which is not defined.

I would advise you to use controller as-Syntax when working with AngularJS and Typescript

Demo

+11
source

Here is the corrected code. Do not mark this as an answer, @Aides in front of me in front of me.

Html Page

<!DOCTYPE html>
<html> <!-- its 2016 -->
<head>
   <script src="Scripts/angular.js"></script>

   <script src="test.js"></script>
   <title></title>

</head>
<body ng-app="testModule">
   <div ng-controller="Test as test">
       <input type="button" ng-click="test.click()" value="test" />
   </div>
</body>
</html>

controller

angular.module("testModule", []);

class Test {

    click() {
        alert();
    }
} 

angular.module("testModule").controller("Test", Test );
+3

More articles:


All Articles