mirror of
https://github.com/Hopiu/angular.js.git
synced 2026-05-10 07:44:43 +00:00
docs(guide/directives): give more details about directive declaration
This commit is contained in:
parent
d56b62dcda
commit
484286d536
1 changed files with 14 additions and 8 deletions
|
|
@ -225,7 +225,12 @@ In this example we will build a directive that displays the current time.
|
||||||
|
|
||||||
# Writing directives (long version)
|
# Writing directives (long version)
|
||||||
|
|
||||||
An example skeleton of the directive is shown here, for the complete list see below.
|
There are different ways to declare a directive. The difference resides in the return
|
||||||
|
value of the factory function. You can either return a Directive Definition Object
|
||||||
|
(see below) that defines the directive properties, or just the postLink function
|
||||||
|
of such an object (all other properties will have the default values).
|
||||||
|
|
||||||
|
Here's an example directive declared with a Directive Definition Object:
|
||||||
|
|
||||||
<pre>
|
<pre>
|
||||||
var myModule = angular.module(...);
|
var myModule = angular.module(...);
|
||||||
|
|
@ -251,12 +256,11 @@ An example skeleton of the directive is shown here, for the complete list see be
|
||||||
});
|
});
|
||||||
</pre>
|
</pre>
|
||||||
|
|
||||||
In most cases you will not need such fine control and so the above can be simplified. All of the
|
In most cases you will not need such fine control and so the above can be simplified. You can still
|
||||||
different parts of this skeleton are explained in following sections. In this section we are
|
return a Directive Definition Object, but only setting the 'compile' function property of the Object,
|
||||||
interested only in some of this skeleton.
|
and rely on the default values for other properties.
|
||||||
|
|
||||||
The first step in simplyfing the code is to rely on the default values. Therefore the above can be
|
Therefore the above can be simplified as:
|
||||||
simplified as:
|
|
||||||
|
|
||||||
<pre>
|
<pre>
|
||||||
var myModule = angular.module(...);
|
var myModule = angular.module(...);
|
||||||
|
|
@ -271,8 +275,10 @@ simplified as:
|
||||||
});
|
});
|
||||||
</pre>
|
</pre>
|
||||||
|
|
||||||
Most directives concern themselves only with instances, not with template transformations, allowing
|
Finally, most directives concern themselves only with instances, not with template transformations, allowing
|
||||||
further simplification:
|
further simplification.
|
||||||
|
|
||||||
|
Here we only define the postLink function:
|
||||||
|
|
||||||
<pre>
|
<pre>
|
||||||
var myModule = angular.module(...);
|
var myModule = angular.module(...);
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue