angular with typescript error, cannot find name angular

Question

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>

Possible duplicate of Getting Error - Cannot find name 'angular' — James Lawruk
– James Lawruk, Commented Sep 1, 2017 at 12:27

g.005 · Accepted Answer · 2016-09-21 13:06:57Z

-2

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';
 }
}

answered Sep 21, 2016 at 13:06

g.005

4063 silver badges12 bronze badges

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

2 Comments

Zakk Over a year ago

Still not working, i get this: {{$ctrl.mytest}} in browser

g.005 Over a year ago

its not $ctrl. Its just ctrl. Copy paste the code and verify it

Collectives™ on Stack Overflow

angular with typescript error, cannot find name angular

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related