javascript - Angular 'PersonCtrl' is not a function, got undefined -

javascript - Angular 'PersonCtrl' is not a function, got undefined -

hi trying build first angular app typescript can not seem bind controller correctly.

this typescript code:

module app { var modules: string[] = ["app.person"]; angular.module('app', modules) .run([]); } module app.person { angular.module('app.person', []); } module app.person { angular.module("app.person") .controller('personctrl', personctrl); interface ipersonscope extends ng.iscope { fullname: string; } interface ipersonctrl { } class personctrl implements ipersonctrl{ public $scope: ipersonscope; static $inject = ['$scope']; constructor($scope: ipersonscope) { this.$scope = $scope; this.init(); } init() : void { this.$scope.fullname = 'justin s.'; } } }

this view code:

<article ng-app> <section ng-controller="personctrl"> <p ng-bind="fullname"></p> </section> </article>

edit after updating html this:

<article ng-app="app"> <section ng-controller="personctrl"> <p ng-bind="fullname"></p> </section> </article>

i started geting next error:

uncaught error: [ng:areq] argument 'fn' not function, got undefined

all related javascript files loaded on page

you need provide application name, root module app or app.person (angular.module('app.person')) value ng-app:

// should root module name <article ng-app="app"> // or app.person // <article ng-app="app.person"> <section ng-controller="personctrl"> <p ng-bind="fullname"></p> </section> </article>

and sure, file definition part of page <script>

javascript angularjs typescript