@@ -143,6 +143,7 @@ function classDirective(name, selector) {
143
143
* @ngdoc directive
144
144
* @name ngClass
145
145
* @restrict AC
146
+ * @element ANY
146
147
*
147
148
* @description
148
149
* The `ngClass` directive allows you to dynamically set CSS classes on an HTML element by databinding
@@ -178,14 +179,21 @@ function classDirective(name, selector) {
178
179
* | {@link ng.$animate#addClass addClass} | just before the class is applied to the element |
179
180
* | {@link ng.$animate#removeClass removeClass} | just before the class is removed from the element |
180
181
*
181
- * @element ANY
182
+ * ### ngClass and pre-existing CSS3 Transitions/Animations
183
+ The ngClass directive still supports CSS3 Transitions/Animations even if they do not follow the ngAnimate CSS naming structure.
184
+ Upon animation ngAnimate will apply supplementary CSS classes to track the start and end of an animation, but this will not hinder
185
+ any pre-existing CSS transitions already on the element. To get an idea of what happens during a class-based animation, be sure
186
+ to view the step by step details of {@link $animate#addClass $animate.addClass} and
187
+ {@link $animate#removeClass $animate.removeClass}.
188
+ *
182
189
* @param {expression } ngClass {@link guide/expression Expression } to eval. The result
183
190
* of the evaluation can be a string representing space delimited class
184
191
* names, an array, or a map of class names to boolean values. In the case of a map, the
185
192
* names of the properties whose values are truthy will be added as css classes to the
186
193
* element.
187
194
*
188
- * @example Example that demonstrates basic bindings via ngClass directive.
195
+ * @example
196
+ * ### Basic
189
197
<example name="ng-class">
190
198
<file name="index.html">
191
199
<p ng-class="{strike: deleted, bold: important, 'has-error': error}">Map Syntax Example</p>
@@ -275,7 +283,8 @@ function classDirective(name, selector) {
275
283
</file>
276
284
</example>
277
285
278
- ## Animations
286
+ @example
287
+ ### Animations
279
288
280
289
The example below demonstrates how to perform animations using ngClass.
281
290
@@ -313,14 +322,6 @@ function classDirective(name, selector) {
313
322
});
314
323
</file>
315
324
</example>
316
-
317
-
318
- ## ngClass and pre-existing CSS3 Transitions/Animations
319
- The ngClass directive still supports CSS3 Transitions/Animations even if they do not follow the ngAnimate CSS naming structure.
320
- Upon animation ngAnimate will apply supplementary CSS classes to track the start and end of an animation, but this will not hinder
321
- any pre-existing CSS transitions already on the element. To get an idea of what happens during a class-based animation, be sure
322
- to view the step by step details of {@link $animate#addClass $animate.addClass} and
323
- {@link $animate#removeClass $animate.removeClass}.
324
325
*/
325
326
var ngClassDirective = classDirective ( '' , true ) ;
326
327
0 commit comments