angularjs - Typescript: Inject custom service in controller in -


i'm trying create custom service , $inject controller. seems basic problem, havn't been able find working solution.

html:

<!doctype html>  <html lang="en" ng-app="myapp">   <head> <title></title> <meta charset="utf-8" />   </head>    <body ng-controller="mycontroller vm">     <script src="scripts/angular.min.js"></script>     <link href="content/bootstrap.min.css" rel="stylesheet" />     <script src="app/animalservice.js"></script>     <script src="app/app.js"></script>      </body> </html> 

i use following code create service, i'm trying call controller.

animalservice.ts:

    module services {     "use strict";      export interface ianimal {         sound: string;         hearmysound(): void;     }      class animal implements ianimal {         sound: string;          constructor() {             this.sound = "rawr";         }          hearmysound(): void {             console.log(this.sound);         }     }     angular.module("myapp")         .service("animal", animal); } 

in controller, trying call function hearmysound(), has string initilized service constructor.

app.ts

module controllers{     class mycontroller {         "use strict";          static $inject = ["animal"];         constructor(animalservice: services.ianimal) {                             animalservice.hearmysound();         }       }     angular.module('myapp', [])         .controller('mycontroller', ["animal", mycontroller]); } 

google chrome console error:

        uncaught error: [$injector:nomod] http://errors.angularjs.org/1.4.8/$injector/nomod?p0=myapp(anonymous function)      @ angular.js:38(anonymous function)      @ angular.js:2005b @ angular.js:1929(anonymous function)      @ angular.js:2003services @ animalservice.ts:20(anonymous function)      @ animalservice.ts:22         angular.js:12520 error: [$injector:unpr] http://errors.angularjs.org/1.4.8/$injector/unpr?p0=animalprovider%20%3c-%20animal%20%3c-%20mycontroller             @ error (native)             @ http://localhost:51139/scripts/angular.min.js:6:416             @ http://localhost:51139/scripts/angular.min.js:41:121             @ object.d [as get] (http://localhost:51139/scripts/angular.min.js:39:92)             @ http://localhost:51139/scripts/angular.min.js:41:195             @ d (http://localhost:51139/scripts/angular.min.js:39:92)             @ object.e [as invoke] (http://localhost:51139/scripts/angular.min.js:39:362)             @ m.instance (http://localhost:51139/scripts/angular.min.js:80:336)             @ d (http://localhost:51139/scripts/angular.min.js:61:362)             @ g (http://localhost:51139/scripts/angular.min.js:55:105)(anonymous function) @ angular.js:12520(anonymous function)  @ angular.js:9292r.$apply @ angular.js:16157(anonymous function)  @ angular.js:1679e  @ angular.js:4523c  @ angular.js:1677yc  @ angular.js:1697zd  @ angular.js:1591(anonymous function)  @ angular.js:29013b  @ angular.js:3057if  @ angular.js:3346hf.d  @ angular.js:3334 

i suspect might not registering service correctly, or registering modules. input appreciated.

updated added full console error msg

result thank @hansmaad, ended up following in order make work:

<script src="app/modulereg.js"></script>     // registrere module <script src="app/app.js"></script>           // controller logic <script src="app/animalservice.js"></script> // service logic 

your module registration should first thing happens. first file include should contain

angular.module('myapp', []); 

in case, you've included animalservice.js before app.js. when register services , controllers later, use

    angular.module('myapp').controller(/*...*/); 

by way, if define injections static $inject = ["animal"]; don't have pass them again in registration. do

angular.module('myapp', [])     .controller('mycontroller', mycontroller); 

Comments

  1. I agree the costs of living in India are much lower than in many other countries, so that one can hire an angular JS developers in their budget from India. If you are looking to hire a freelancer, I suggest Eiliana.com, which is a freelancing portal, and from here, you can get the best professionals from India.

    ReplyDelete

Post a Comment

Popular posts from this blog

android - Why am I getting the message 'Youractivity.java is not an activity subclass or alias' -

python - How do I create a list index that loops through integers in another list -

c# - “System.Security.Cryptography.CryptographicException: Keyset does not exist” when reading private key from remote machine -