Configuring ng.Module controller in other files
I have the following JavaScript that I would like to convert to TypeScript, but I am amazed :(
Js
var app = angular.module('app', []);
app.config([...]);
app.run([...];
(function (ng, app) {
app.controller('appCtrl', [..., function(...)])
})(angular, app);
This is what I have so far.
TS
File1:
/// <reference path="../Scripts/typings/angularjs/angular.d.ts" />
module App {
"use strict";
var mod:ng.IModule = angular.module(name, []);
}
File2:
/// <reference path="../Scripts/typings/angularjs/angular.d.ts" />
module App {
'use strict';
export interface IAppCtrlScope extends ng.IScope {
greeting: string;
changeName(name): void;
}
export class AppCtrl {
public static $inject = [
'$scope'
];
constructor(private $scope: IAppCtrlScope) {
$scope.greeting = 'asdf';
$scope.changeName = (name) => {
$scope.greeting = 'Hello ' + name + ' !';
}
}
}
mod.controller('appCtrl', AppCtrl); // this doesn't work
}
The reason for doing it mod.controller('appCtrl', AppCtrl)
in the file where the controller is defined is because it is much easier to maintain.
+3
source to share
2 answers
So the solution was really pretty simple. All I had to do was export the variable.
module Application {
'use strict';
export var angularApp: ng.IModule = angular.module("app", []);
}
module Application {
'use strict';
export interface IAppCtrlScope extends ng.IScope {
greeting: string;
changeName(name): void;
}
export class AppCtrl {
public static $inject = [
'$scope'
];
constructor(private $scope: IAppCtrlScope) {
$scope.greeting = 'asdf';
$scope.changeName = (name) => {
$scope.greeting = 'Hello ' + name + ' !';
}
}
}
angularApp.controller('appCtrl', AppCtrl)
}
+1
source to share
I would use the class as a controller. See https://youtube.com/watch?v=WdtVn_8K17E&hd=1 for an example .
0
source to share