We can create our own filters in AngularJS. It can be performed by associating the filter to our module. These types of filters are known as custom filters.

An example given below can be used to count the number of elements in the string by using the filter:

As per above example, if the string is "21, 34, 45" then output after applying filter will be 3.

The currency filter contains the "$" Dollar symbol as default. We can apply the following code as the html template format of Currency Filter.

We can use Currency Filter by using the following methods:

• Default
  If we do not provide any currency symbol, then Dollar sign will be used by default as shown below:
  
  Default Currency{{amount | currency}}
• User-Defined
  To use different types of currency symbols, we have to define our own symbol by applying the Hexa-Decimal code or Unicode of that Currency.
  E.g., To define Indian Currency Symbol, then we have to use Unicode-value or Hexa-Decimal value.
  Indian Currency{{amount | currency:"&# 8377"}}

Dependency Injection (also called DI) is one of the best features of AngularJS. It is a software design pattern where objects are passed as dependencies rather than hard coding them within the component. It is useful for removing hard-coded dependencies and making dependencies configurable. To retrieve the required elements of the application that need to be configured when the module is loaded, the "config" operation uses Dependency Injection. It allows separating the concerns of different components in an application and provides a way to inject the dependent component into the client component. By using Dependency Injection, we can make components maintainable, reusable, and testable.

A simple case of dependency injection in AngularJS is shown below:

Here, a controller is declared with its dependencies.

AngularJS provides the following core components which can be injected into each other as dependencies:

• Value
• Factory
• Service
• Provider
• Constant

AngularJS enriches form filling and validation. AngularJS provides client-side form validation. It checks the state of the form and input fields (input, text-area, select), and notify the user about the current state. It also holds the information about whether the input fields have been touched, or modified, or not.

There are following directives that can be used to track error:

• $dirty
  It states that the value has been changed.
• $invalid
  It states that the value which is entered is invalid.
• $error
  It states the exact error.

Moreover, we can use novalidate with a form declaration to disable the browser's native form validation.

Link is used for combining the directives with a scope and producing a live view. The link function is used for registering DOM listeners as well as updating the DOM. The linking function is executed as soon as the template is cloned.

There are two types of linking function:

• Pre linking function
  Pre-linking functions are executed before the child elements are linked. This method is not considered as a safe way for DOM transformation.
• Post linking function
  Post-linking functions are executed after the child elements are linked. This method is a safe way for DOM transformation.

An injector is referred to as a service locator. It is used to receive object instances as defined by the providers, invoke methods, instantiate types, and load modules. Each Angular application consists of a single injector which helps to look upon an instance by its name.

Factory method is used for creating a directive. Whenever the compiler matches the directive for the first time, the factory method is invoked. Factory method is invoked using $injector.invoke.

Syntax

Each Angular application contains one root scope, but there can be several child scopes. The application may have multiple scopes because child controllers and some directives create new child scopes. When the new scope is formed or created, it is added as a child of the parent scope. As similar to DOM, scopes also create a hierarchical structure.

Logs can be maintained using $log service. The main purpose of $log service is to help in debugging and troubleshooting. It is done with the help of the following methods.

• log()- It writes a log message in the console.
• info()- It writes an information message.
• warn()- It writes a warning message.
• error()- It writes an error message.
• debug()- It writes a debug message.

Find index is used to return the position of an element. It returns the value (-1) if the requested element is not found.

In the given code, index of the object is returned where item.date=2018-12-12.