Essai de code TypeScript AngularJS

**Hippocrène** · 15/10/2015, 13h11

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 TypeScript :

Sélectionner tout - Visualiser dans une fenêtre à part

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 TypeScript :

Sélectionner tout - Visualiser dans une fenêtre à part

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 HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

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.

**yoyo88** · 02/05/2016, 18h53

Bonjour, malheureusement je connais assez mal en Agular.

mais tu peux déjà vérifier si les .js générer contienne bien du code. afin de valider que ton code TS est bon.

Essai de code TypeScript AngularJS

TypeScript

Discussions similaires

Partager

Partager