We can discard the original element, where the directive was attached, replacing it by the directive's template. This can be done by enabling the replace property:

parking.directive("alert", function() {
return {
templateUrl: "alert.html",
replace: true
The following code is the compiled directive without the original element.
<div class="alert" alert="">
<span class="alert-topic">
Something went wrong!
<span class="alert-description">
You must inform the plate and the color of the car!
Related Tutorial
7. replace

9. scope
11. link
12. require
14. compile