Wiki SGY.io

Outils pour utilisateurs

Outils du site

Piste :
web:javascript:angularjs:directives_built-in

Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

Les deux révisions précédentesRévision précédente
Prochaine révision		Révision précédente
web:javascript:angularjs:directives_built-in [2014/12/04 03:29] – sgariepyweb:javascript:angularjs:directives_built-in [2022/02/02 00:42] (Version actuelle) – modification externe 127.0.0.1
Ligne 1: Ligne 1:
-====== ng-repeat ======+====== Directives de base ======
  
  
-====== ng-click ======+  * ngApp 
 +  * ngController 
 + 
 + 
 +===== ng-model ===== 
 + 
 +Fonctionne sur trois types d'éléments : 
 +  * input 
 +  * select 
 +  * textarea 
 + 
 + 
 + 
 + 
 +====== Événementiels ====== 
 + 
 +  * ngClick 
 +  * ngDblClick 
 +  * ngMousedown 
 +  * ngMouseenter 
 +  * ngMouseleave 
 +  * ngMousemove 
 +  * ngMouseover 
 +  * ngMouseup 
 + 
 +===== ng-change ===== 
 + 
 +A besoin de la directive ''ng-model''. 
 + 
 + 
 + 
 +====== Présentation ====== 
 + 
 +===== ngStyle ===== 
 + 
 + 
 +===== ngClass ===== 
 + 
 + 
 +===== ngClassEven ===== 
 + 
 + 
 +===== ngClassOdd ===== 
 + 
 +====== Divers ====== 
 + 
 + 
 + 
 + 
 +===== ng-bind ===== 
 + 
 +Remplace l'utilisation des accolades. 
 + 
 +<code html> 
 +<div ng-bind="model.name"></div> 
 +</code> 
 + 
 +Le code ci-haut a le même effet que : 
 +<code html> 
 +<div>{{model.name}}</div> 
 +</code> 
 + 
 +===== ng-bind-template ===== 
 + 
 +Un peu comme ''ng-bind'', sauf qu'il permet de faire un //template//.  On peut placer plusieurs items. 
 + 
 +<code html> 
 +<div ng-bind-template="{{model.name}} (Date: {{model.date}})"></div> 
 +</code> 
 + 
 + 
 + 
 +===== ngBindHtml ===== 
 + 
 +Permet d'inclure du HTML d'une source pas sûre. 
 + 
 +Si on a dans le contrôleur : 
 +<code javascript> 
 +$scope.snippet = '<span style="color:red;">allo</span>'; 
 +</code> 
 + 
 +Et dans le HTML ceci: 
 +<code html> 
 +<div ng-bind-html="snippet"></div> 
 +</code> 
 + 
 +Le ''<span>'' va apparaître dans le ''<div>'', mais tout style (de couleur rouge) sera enlevé et probablement les scripts et autres éléments non sécures. 
 + 
 +===== ngBindHtmlUnsafe ===== 
 + 
 + 
 +Même principe que **ngBindHtml**, mais affichera le HTML tel quel.  Utilisé quand la source du HTML est de confiance. 
 + 
 +Attention, peut donner lieu à des attaques XSS. 
 + 
 + 
 + 
 +===== ng-show / ng-hide ===== 
 + 
 + 
 +===== ng-repeat ===== 
 + 
 + 
 +===== ngCloak ===== 
 + 
 + 
 +Règle CSS: 
 + 
 +<code css> 
 +[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak { 
 +  display: none; 
 +} 
 +</code> 
 + 
 + 
 + 
 +===== Autres ===== 
 +  * ngDisabled 
 +  * ngChecked 
 +  * ngMultiple 
 +  * ngReadonly 
 +  * ngSelected 
 + 
 + 
 + 
 +===== ngForm ===== 
 + 
 +Permet d'imbriquer des ''form'' dans une ''form''. 
 +===== ngSubmit ===== 
 + 
 + 
 + 
 +===== ngHref ===== 
 + 
 + 
 +===== ngSrc ===== 
 + 
 +===== ngNonBindable =====
  
web/javascript/angularjs/directives_built-in.1417660152.txt.gz · Dernière modification : 2022/02/02 00:43 (modification externe)