Skip to content

Angularjs directive scope sharing

October 29, 2014
tags:

Basics
directives are interpreted by compiler ($compile) service that attach events/change dom. $interpolate is used to evaluate the expressions. $compile invokes directive once using $injector.invoke.

Types
template (html content) or template-url linked to directive (template-url can also be fn(ele,attrs) – Cannot access scope inside template-url as scope created later.
You can create nested directives

Scope
transclude : Nested scope. Uses outer scope instead of inner scope of directive.
isolated scope – isolated scope – isolates all variables except those you mention.
. used to separate directive scope from parent except for specific scoped variables you want to pass from parent ctrl to directive you use scope inside directive , like:

scope: {
directiveScope: '=scopeAttr'
}

Return object from directive instead of fn.
Create prefixes for your own directives
Cleanup: element.on(‘$destroy’, …) or scope.$on(‘$destroy’, …) when directive is removed.
only use transclude: true when you want to create a directive that wraps arbitrary content.
=scope and &externalBehavior in outer context : to expose API

Advertisements
No comments yet

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: