AngularJS $location Service

The $location in AngularJS basically uses a window.location service. The $location is used to read or change the URL in the browser and it is used to reflect that URL on our page. Any change made in the URL is stored in the $location service in AngularJS. There are various methods in the $location service such as absUrl(), url([URL]), protocol(), host(), port(), path([path]), search(search, [paramValue]), hash([hash]), replace(), and state([state]). Also, there are two events available i.e. $locationChangeStart and $locationChangeSuccess. Now let us see some methods one by one of $location service.

• absUrl() Method: It returns the full path of your page and it is a read-only method.

Example 1: This example describes the absUrl() Method in AngularJS.

Output:

👁 Image

• port() Method: It is also a read-only method that returns the port number in which you are currently working.

Example 2: This example describes the usage of the port() Method in AngularJS.

Output:

👁 Image

• protocol() Method: It returns the current protocol of the current URL and it is also a read-only method.

Example 3: This example describes the basic usage of the protocol() Method in AngularJS.

Output:

👁 Image

• host() Method: It returns the current host of the current URL and also it is a read-only method.

Example 4: This example describes the basic usage of the host() Method in AngularJS.

Output:

👁 Image

• search() Method: It is a read and writes method of $location. It returns the current search parameters of the URL when passed without parameters and when passed with parameters it returns the $location object.

Example 5: This example describes the basic usage of the search() Method in AngularJS.

Output:

👁 Image

• hash() Method: It is a read and writes method of $location service. It returns the current hash value of the current URL when called without parameters and when called with parameters it returns the$location object.

Example 6: This example describes the basic usage of the hash() Method in AngularJS.

Output:

👁 Image