Basic AngularJS with Routing [Part 2]

In my last blog, Basic AngularJS with Routing [Part 1], I discussed AngularJS Controllers with examples. In this blog, I delve into Directive and Services.

Directives – Introduction

We have used some Directives previously with Angular, i.e. Directives such as ng-app and ng-controller. Now, in this blog, I want to show you a few other useful Directives, like the Directive to handle button clicks and the Directive to move user input into my JavaScript model. These Directives allow you to build interactive webpages that not only display data, but also react to the user and become a little more dynamic. We will build something that lets the user search, sort, and browse code repositories.

ng-model, ng-click

Java Script



Angular JS







ng-show and hide

User Model

If user model is not empty then user details will be displayed.


A service in Angular is a component that performs a specific job, like providing a timer, or providing the ability to communicate over HTTP. We have seen that component and used it; it is the $http service. Services are very important concepts where it will be initiated only once for an application.


  • Gangaraju Kunaparaju

    Gangaraju Kunaparaju is a Module Lead at Trigent. He has more than eight years of experience in Microsoft .NET Technologies. His specific interest areas are learning new technologies, listening to music and playing cricket.