Essai de code TypeScript AngularJS
Bonjour,
après m’être intéressé de plus près à JavaScript (et en avoir entendu beaucoup de mal) j’ai été amené à découvrir TypeScript (j’ai bien compris que, finalement, ça restait du JavaScript).
J’utilise la bibliothèque AngularJS (1.4.7) et j’ai chercher quelques tutoriels pour en apprendre plus sur l’utilisation des deux technologies simultanément. J’en ai trouvé quelques unes, mais assez compliquées car souvent très longues et pas assez bien organisées, ainsi qu’un manque d’exemples récurrent.
J’ai donc essayé, d’après ce que j’ai vu, de faire un code assez simple, affichant le contenu d’une variable dans une page HTML. (J’ai entre autres suivi ce tutoriel.)
Mon app.ts :
Code:
1 2 3 4 5 6 7 8 9
| /// <reference path="typings/angularjs/angular.d.ts" />
/// <reference path="typings/angularjs/angular-route.d.ts" />
module app{
"use strict";
angular
.module("app", ['']);
} |
mon controller.ts :
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19
| /// <reference path="typings/angularjs/angular.d.ts" />
/// <reference path="typings/angularjs/angular-route.d.ts" />
module app {
class controller {
text: string = "";
constructor(text: string) {
var vm = this;
vm.text = "A";
}
}
angular
.module("app")
.controller("controller", controller);
} |
mon test.html :
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15
| <!DOCTYPE HTML>
<html ng-app="app">
<head>
<meta charset="UTF-8">
<title>TEST</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js"></script>
<script src"app.js"></script>
<script src"controller.js"></script>
</head>
<body ng-controller="controller as c">
<div>{{ c.text }}</div>
</body>
</html> |
Je les ai transformés en .js avec la commande tsc venant de node.js (je crois).
mais je n’obtiens pas la conversion du {{ c.text }} en A.
Pouvez vous m’éclairer sur le sujet. Merci.