alexander-fire alexander-fire - 4 months ago 37
TypeScript Question

AngularJS: Failed to instantiate my own module

I´ve tried to start with TypeScript and AngularJS but after the first few lines based on a Tutorial I get this confusing error.

It seems that something is wrong with my

mydModule
?

angular.js:68 Uncaught Error: [$injector:modulerr] Failed to instantiate module mydModule due to:
Error: [$injector:nomod] Module 'mydModule' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.


index.html

<html ng-app="mydModule">
<body>
<script src="Scripts/angular.js"></script>
<script src="App_Scripts/start.js"></script>
<script src="App_Scripts/startController.js"></script>
<div class="wrapper container">
<div class="row" ng-controller="startController as vm">
<div id="content">
Tst:
<ul>
<li ng-repeat="label in vm.sequence">
<span ng-style="{'background-color':label.Color}">{{label.Text}}</span>
</li>
</ul>
</div>
</div>
</div>
</body>
</html>


start.ts

/// <reference path="../scripts/typings/angularjs/angular.d.ts" />
module DosierradApplication {
export class StartPage {
static mydModule = angular.module('startPage', ['ngResource']);
}
}


startController.ts

/// <reference path="../scripts/typings/angularjs/angular.d.ts" />
/// <reference path="start.ts" />
module DosierradApplication {
export class startController {
constructor(private $scope: ng.IScope) {

}

sequence = [
{
"Id": 0,
"Text": "all good",
"Color": "#0f0"
},
{
"Id": 1,
"Text": "not good",
"Color": "#ff0"
}
];
}

StartPage.mydModule.controller('startController', ["$scope", startController]);
}

Answer

You've called your module 'startPage' and trying to access it as 'mydModule'. So it should be

<html ng-app="startPage">

mydModule is variable name, not a module name in above sample.