Qu'est-ce qu'une directive dans Angular.JS

Question

J'ai du mal à comprendre les directives dans AngularJS. La définition qu'en donne AngularJS lui-même est au mieux confuse :

Directives are a way to teach HTML new tricks. During DOM compilation directives are matched against the HTML and executed. This allows directives to register behavior, or transform the DOM.

Quelqu'un pourrait-il expliquer les directives dans AngularJS dans un anglais simple, couramment utilisé dans l'enseignement de la programmation ? Quelque chose comme : directives are funcions/objects that extends ...

Answer 1

Ils sont un moyen d'étendre le HTML, en ajoutant de nouveaux éléments et/ou en ajoutant de nouveaux attributs aux éléments existants. Extrait du guide du développeur d'Angular :

Une directive est un comportement ou une transformation DOM qui est déclenchée par la présence d'un attribut personnalisé, d'un nom d'élément ou d'un nom de classe. Une directive vous permet d'étendre le vocabulaire HTML de manière déclarative.

Vous pouvez les utiliser soit pour ajouter un comportement au HTML, soit pour définir une enlace qui maintient une liaison bidirectionnelle entre les variables appartenant aux scopes et les éléments DOM, ou pour manipuler dynamiquement le DOM, en définissant une fonction compiler qui peut modifier ou même générer de nouveaux éléments et attributs DOM. Considérez-le comme un moyen d'étendre le HTML et de le transformer en un élément de type Langage spécifique au domaine .

Answer 2

Les directives peuvent être des attributs, des balises ou même des noms de classe.

Une fois que vous les écrivez dans votre balisage HTML, il est récupéré par Angular et agit de la manière dont vous l'avez défini.

Il vous donne la possibilité de définir de nouveaux éléments HTML personnalisés tels que ou , ou de nouveaux attributs de comportement tels que

<div angry></div>

Et chaque fois que quelqu'un cliquera sur cette division, il recevra une alerte avec "Je suis en colère".

Vous pouvez faire toutes les extensions dont vous avez besoin pour rendre votre html aussi simple et compréhensible que possible. Tout dépend de la façon dont vous définissez votre directive.

Answer 3

Les directives AngularJS sont une combinaison du balisage du modèle HTML (c'est-à-dire des attributs, des éléments et des classes CSS) et du support du code JavaScript. Le code JavaScript d'AngularJS définit les données html et le comportement de l'élément html.

Les directives AngularJs sont utilisées pour étendre le vocabulaire HTML, c'est-à-dire qu'elles décorent les éléments html avec un nouveau comportement et aident à manipuler les attributs des éléments html de manière intéressante.

Il existe des directives intégrées fournies par AngularJS, telles que ng-app, ng-controller, ng-repeat, ng-model, etc.