Menu
I've been reading this nice recent article about new .component() helper in Angular 1.5, which is supposed to help everyone to migrate to Angular 2 eventually. Everything looks nice and simple, but I couldn't find any information about DOM manipulation inside components.
There is a template property though, which can be a function and accept $element and $attrs arguments. Still it's not clear to me if that's the replacement for a link function. It doesn't seem so.
320
Link: The link function deals with linking scope to the DOM. Using Code for Compile. While defining a custom directive we have the option to define a link against which either we can define a function or we have the option to assign an object which will have pre & post function.
Component is used to break up the application into smaller components. But Directive is used to design re-usable components, which is more behavior-oriented. That is why components are widely used in later versions of Angular to make things easy and build a total component-based model.
Explain what is the difference between link and compile in angular. js? Compile function: It is used for template DOM Manipulation and collect all of the directives. Link function: It is used for registering DOM listeners as well as instance DOM manipulation.
Answer:The link option is just a shortcut to setting up a post-link function. controller: The directive controller can be passed to another directive linking/compiling phase. It can be injected into other directices as a mean to use in inter-directive communication.
EDIT 2/2/16: The 1.5 documentation now covers components: https://docs.angularjs.org/guide/component
Some thoughts based on some reading (links below):
Components aren't replacements for directives. A component is a special type of directive that organizes a controller with a template.
Components do not have a link function and controllers still are not where you'd handle DOM manipulation.
If you need DOM manipulation, your component can use other directives that include that DOM manipulation in a link function.
It took me a while to figure this out, but once I did it made some sense: components are directives but not all directives are--or need to be--components.
The question about link functions is a natural one, or was to me, when I thought components were replacing directives. Why? Because we've been taught to put DOM manipulation inside a directive's link function: "Directives that want to modify the DOM typically use the link option to register DOM listeners as well as update the DOM." https://docs.angularjs.org/guide/directive.
If you're running with that assumption (components replace directives), then you'll find that the Angular docs don't answer the question because, well, it's not the right question once you know the purpose of a component. (Components are described in the $compileProvider documentation not the directive documentation.)
What I say above is really a rephrasing of what Todd Motto has said in what's probably the best discussion (so far) on components and directives:
https://www.reddit.com/r/angularjs/comments/3taxjq/angular_15_is_set_to_introduce_the_component/
It could be useful to have those comments pulled out into a more general article.
Most articles on components don't mention a link function (this doesn't mean these aren't excellent articles):
https://toddmotto.com/exploring-the-angular-1-5-component-method/
https://medium.com/@tomastrajan/component-paradigm-cf32e94ba78b#.vrbo1xso0
https://www.airpair.com/angularjs/posts/component-based-angularjs-directives
Or when the link function is mentioned it is in parentheses:
http://teropa.info/blog/2015/10/18/refactoring-angular-apps-to-components.html
One article says that components, "use controllers instead of link functions." But it's not an "instead" situation: controllers aren't stand-ins for link functions.
120
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
