AngularJS je m'y mets !

Directives

Pour le template jusqu'à présent j'ai prévu quelque chose de simple intégré dans la définition de la directive. Cette approche est correcte tant que le code n'est pas trop volumineux. Si c'est le cas il vaut mieux prévoir de le placer dans un fichier distinct et de le charger avec la propriété templateUrl :

<div ng-app="monApplication" ng-controller="controleur">
	<monespace-directive></monespace-directive>
	<script>
		var monModule = angular.module('monApplication', []);
		monModule.controller('controleur', function($scope) {
			$scope.noms = {
				nom: 'Durand',
				prenom: 'Pierre'
			};
		})
		monModule.directive('monespaceDirective', function () {
			return {
				restrict: 'E',
				templateUrl: 'noms.html'
			};
		});
	</script>
</div>
Nom : {{noms.nom}} <br>
Prénom : {{noms.prenom}}

J'ai créé un contrôleur pour initialiser des données dans le scope : un nom et un prénom. La restriction étant fixée à l'élément ('E') on peut directement utiliser la directive comme nom de balise. La propriété templateUrl référence le fichier noms.html qui contient le template à utiliser. Remarquez que ce template contient des expressions. On pourrait même imaginer placer ici d'autres directives...

Précédent

Retour à l'accueil...