Angular is declarative?

You have been hearing this term a lot about angular that it has  a declarative syntax.

So what is declarative programing(or language)?

A declarative language is a very high level language which only tell what needs to be done and not how it will be done.

For an example:

HTML is a declarative language. On an html page you only write a form with some inputs fields (what needs to be done)but you are not worried about how this fields will be populated or how this data will be used in the application (the business logic is separated from UI logic).Screen Shot 2016-03-08 at 4.58.24 PM.png

Angular is build on declarative programming principles. Angularjs extends plain old HTML by use of directives and add some dynamic behavior to it.

Example of directive:

source 

Screen Shot 2016-03-08 at 4.05.31 PM.png

In the above example ng-controller is a directive that is embedded in the html div tag. This only tell which controller to user for this div but it does not tell what is the controller is actually doing (business logic). Also, notice weird syntax  on  {{counter}}. This is another directive used for data binding. In the above example,  MyController (controller) will set a default value of (0) of counter initially when this page is loaded in a browser. So, again the logic of setting the default value is done in controller and it is hidden from UI logic.

In Angular, by using declarative syntax (via directives) you can express how your DOM will be manipulated when state of your application changes. In Angular, most of the time you will never write a code to programmatically manipulate the DOM()But it allows you to do so if you want to. Angular takes away the low level DOM manipulations tasks.

 

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 )

Google photo

You are commenting using your Google 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 )

Connecting to %s