Zakk Zakk - 2 months ago 11
TypeScript Question

angular with typescript error, cannot find name angular

I done all the settings including adding typescript compiler in webstorm, installing tsd with npm, and all other stuff.

I still get error 'Cannot find name Angular'

tsd.json

{

"version": "v4",
"repo": "borisyankov/DefinitelyTyped",
"ref": "master",
"path": "typings",
"bundle": "typings/tsd.d.ts",
"installed": {
"angularjs/angular.d.ts": {
"commit": "70a693ec17c7ae4b9b7c1fa6c399ac3e82e3843e"
},
"jquery/jquery.d.ts": {
"commit": "70a693ec17c7ae4b9b7c1fa6c399ac3e82e3843e"
}
}
}


sorting.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
{{$ctrl.mytest}}
</body>
</html>


sorting.ts

var app = angular.module('myApp', []);
app.component('sorting', {
templateUrl: 'modules/sorting/sorting.html',
controller: SortingClass
});

class SortingClass {

public mytest: string = 'abcd';

}


index.html

<!DOCTYPE html>
<html>
<head lang="en">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta charset="UTF-8">
<title> Facility</title>
<script type="text/javascript" src="bower_components/angular/angular.js"></script>
<script src="modules/sorting/sorting.js" type="text/javascript"></script>
</head>
<body>
</body>

Answer

My friend, you have lot of syntax errors. Please have a look at the basics of angular js. For now, try this code. This should work:

Index.html

<!DOCTYPE html>
<html ng-app="myApp">
<head lang="en">
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta charset="UTF-8">
    <title> Facility</title>
    <script type="text/javascript" src="bower_components/angular/angular.js"></script>
    <script src="modules/sorting/sorting.js" type="text/javascript"></script>
</head>
<body ng-controller="sorting as ctrl">
   <div> {{ctrl.mytest}} </div>
</body>
</html>

Sorting.ts

module xyz {
var angular: any;
var app = angular.module('myApp', []);
app.controller('sorting', SortingClass);

 public class SortingClass {
   public mytest: string = 'abcd';
 }
}
Comments