formations/javascript/angular/creation-directives-1.md

.cadoles-slide-title[Création de directives (1/4)]

• Les directives sont des composants réutilisables.

Création d'une directive basique

<!-- Fichier index.html -->
<div ng-app="myApp">
  <ca-adresse-cadoles></ca-adresse-cadoles>
</div>

<script>
  angular.module('myApp', [])
    .directive('caAdresseCadoles', function() {

      return { // On retourne le descripteur de notre directive
        templateUrl: 'adresse-cadoles.html' // ou template: "<div>....</div>"
      };

    })
  ;
</script>

<!-- Fichier adresse-cadoles.html -->
<div class="adresse-cadoles">
  Cadoles
  2 bis, Cours Fleury
  21000 DIJON
  FRANCE
</div>