I've been diving into AngularJS and TypeScript with the VS2015 RC Cordova TypeScript project.
Recently, I created a "MyController.ts" file in the same folder as "index.ts". The code worked perfectly fine:
module MyTestApp{
export class MyController
{
constructor( $scope )
{
$scope.message = { title: "Hello World!!" };
}
}
}
var myApp = angular.module( 'myTestApp', [] );
myApp.controller( 'myController', MyTestApp.MyController );
However, things started to get tricky when I added another file called "YourController.ts" in the same folder as "MyController.ts". This caused some issues:
module MyTestApp{
export class YourController
{
constructor( $scope )
{
$scope.message = { title: "Hello World!!" };
}
}
}
I placed this code at the end of MyController.ts since controllers need to be added to the angular module:
myApp.controller( 'myController', MyTestApp.YourController);
After compiling the project, I encountered an error message. It seems that these ts files are compiled sequentially into "appBundle.js" based on alphabetical order.
The issue arises because "YourController.ts" is listed after "MyController.ts", causing the line
myApp.controller( 'myController', MyTestApp.YourController);
to not find "YourController" within the "appBundle.js" file below it.
I understand that JavaScript runs sequentially, so I can rearrange the code in "YourController.ts". However, what if I add another controller like "ZooController.ts"? Should I continue moving code around?
If anyone has suggestions on where to properly place the code, please let me know.
Thank you!