AngularJS
Directives
and 
Services

Tightly coupled  directives have no isolated scope so this directive will be using the scope it is nested within in the html
(For example a controller's scope)

Loosely coupled directives have an isolated scope, but you add properties to the isolate  scope from the directive's parent scope
(Such as a controller)

The use of "=?" means you will optionally be adding data-binding from the parent's scope into the directive's scope

Optional scope property "list"

Attaching the property "list" to your directive's scope using a property from the parent scope(a controller)

The use of @? means you will optionally be adding a string value  into the directive's scope

If you drop the '?' then it means a value is required 

$scope.$watch && $scope.$broadcast 

scope.$on

The link method

Discuss

What is the = symbol used for when creating isolated scope?

What is the @ symbol used for when creating isolated scope?

What is a tightly coupled directive?

What is a loosely coupled directive?

What is isolate scope?

What is the link method used for in a directive?

What is $scope.$watch, $scope.$broadcast ,and $scope.$on? Why would you use them?

AngularJS Services

Lazily instantiated - Angular only instantiates(loads) a service when an application component injects it as a dependency

Singletons - Each application component dependent on a service gets a reference to a sing instance generated by the service.

This allows each component dependent on a service to use to the same set of data and methods.

Encapsulation pattern

Encapsulation is when you add hidden data to a constructor and expose different methods to either retrieve data from the hidden data or modify the hidden data.
Those methods are called getters and setters.

This is a common object oriented programming pattern and is generally considered to be best practice when using constructors. 
Since an angular service is a singleton constructor then it is recommended to use the encapsulation pattern.

AngularJS Services

Injecting and using your service

Because the service is a singleton, the data you modify and return from the service is the same data that will be accessible in other directives or controllers that inject the service as a dependency

Utility service

No need for encapsulation in this case

Discuss

What does "Lazily instantiated" mean?

Angular services are "Singletons" what does that mean?

How do you use services in your application?

Why are services useful?

What is encapsulation?

When should you use encapsulation in angular services?