Questions tagged [angularjs-directive]

AngularJS directives are a way to teach HTML new tricks by extending the HTML vocabulary. Directives allow you to manage DOM elements in a declarative pattern, freeing you from low level DOM manipulation tasks.

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.

A directive is a behavior or DOM transformation which is triggered by the presence of a custom attribute, element name, or a class name. A directive allows you to extend the HTML vocabulary in a declarative fashion.

Angular comes with a built in set of directives which are useful for building web applications but can be extended such that HTML can be turned into a declarative domain specific language (DSL).

One can create his/her own custom directives in order to have own manipulations according to one's requirement.

Useful links

17531 questions
215
votes
3 answers

Angular JS: What is the need of the directive’s link function when we already had directive’s controller with scope?

I need to perform some operations on scope and the template. It seems that I can do that in either the link function or the controller function (since both have access to the scope). When is it the case when I have to use link function and not the…
Yugal Jindle
  • 44,057
  • 43
  • 129
  • 197
213
votes
7 answers

How can I dynamically add a directive in AngularJS?

I have a very boiled down version of what I am doing that gets the problem across. I have a simple directive. Whenever you click an element, it adds another one. However, it needs to be compiled first in order to render it correctly. My research led…
PCoelho
  • 7,850
  • 11
  • 31
  • 36
200
votes
6 answers

Understanding the transclude option of directive definition?

I think this is one of the hardest concept for me to understand with angularjs's directive. The document from http://docs.angularjs.org/guide/directive says: transclude - compile the content of the element and make it available to the directive.…
Freewind
  • 193,756
  • 157
  • 432
  • 708
199
votes
7 answers

Add directives from directive in AngularJS

I'm trying to build a directive that takes care of adding more directives to the element it is declared on. For example, I want to build a directive that takes care of adding datepicker, datepicker-language and ng-required="true". If I try to add…
179
votes
3 answers

When to use transclude 'true' and transclude 'element' in Angular?

When should I use transclude: 'true' and when transclude: 'element' ? I cant find anything about transclude: 'element' in the angular docs, they are pretty confusing. I would be happy if someone could explain this in simple language. What is the…
LauroSkr
  • 2,159
  • 2
  • 15
  • 15
175
votes
6 answers

Use of symbols '@', '&', '=' and '>' in custom directive's scope binding: AngularJS

I have read a lot about the use of these symbols in the implementation of custom directives in AngularJS but the concept is still not clear to me. What does it mean if I use one of the scope values in the custom directive? var mainApp =…
Ram
  • 3,887
  • 4
  • 27
  • 49
171
votes
6 answers

Angular.js directive dynamic templateURL

I have a custom tag in a routeProvider template that that calls for a directive template. The version attribute will be populated by the scope which then calls for the right template. There are…
Alen Giliana
  • 2,144
  • 3
  • 17
  • 30
170
votes
5 answers

Can an angular directive pass arguments to functions in expressions specified in the directive's attributes?

I have a form directive that uses a specified callback attribute with an isolate scope: scope: { callback: '&' } It sits inside an ng-repeat so the expression I pass in includes the id of the object as an argument to the callback…
Ed_
  • 18,798
  • 8
  • 45
  • 71
152
votes
3 answers

AngularJS Directive with default options

I'm just starting with AngularJS, and am working on converting a few old jQuery plugins to Angular directives. I'd like to define a set of default options for my (element) directive, which can be overridden by specifying the option value in an…
Ken Chatfield
  • 3,277
  • 3
  • 22
  • 27
147
votes
7 answers

What is the difference between ng-app and data-ng-app?

I have begun to learn about AngularJS and am confused about what the differences are between the ng-app and data-ng-app directives.
user1876508
  • 12,864
  • 21
  • 68
  • 105
133
votes
3 answers

$watch'ing for data changes in an Angular directive

How can I trigger a $watch variable in an Angular directive when manipulating the data inside (e.g., inserting or removing data), but not assign a new object to that variable? I have a simple dataset currently being loaded from a JSON file. My…
Nicholas Pappas
  • 10,439
  • 12
  • 54
  • 87
131
votes
13 answers

if a ngSrc path resolves to a 404, is there a way to fallback to a default?

The application I'm building requires my user to set 4 pieces of information before this image even has a chance of loading. This image is the center-piece of the application, so the broken image link makes it look like the whole thing is borked.…
will_hardin
  • 1,319
  • 2
  • 9
  • 5
129
votes
1 answer

what's the meaning of '=?' in angularJS directive isolate scope declaration?

Does the question mark after equals have special meaning? ie: scope: {foo: '=?'} does the above mean 'do not raise error if 'foo' cannot be resolved?
Nikita
  • 6,019
  • 8
  • 45
  • 54
128
votes
14 answers

Controller not a function, got undefined, while defining controllers globally

I am writing a sample application using angularjs. i got an error mentioned below on chrome browser. Error is Error: [ng:areq] http://errors.angularjs.org/1.3.0-beta.17/ng/areq?p0=ContactController&p1=not%20a%20function%2C%20got%20undefined Which…
yokks
  • 5,683
  • 9
  • 41
  • 48
124
votes
4 answers

Angular ng-change delay

I have an input which filters a ng-repeat list on change. The repeat contains a lot of data and takes a few seconds to filter through everything. I would like their to be 0.5 second delay before I start the filtering process. What is the correct way…
MGot90
  • 2,422
  • 4
  • 15
  • 31