In this post, I am going to provide a simple introduction to AngularJS. We are going to talk about its components, when to use it, and what makes it different.
First, it is important to explain some basic concepts.
Scope is the context where we define for example our variables and functions, and within it, we can access everything we have mentioned.
Here is an example to analyze exactly what happens in it.
Why can the function access “a” but the general scope cannot access “b”?
All this is due to a concept called “Closure”. “Closure” states that a function can access all the elements that are in the scope where it was defined.
Let’s think of it as layers: each existing layer adds a new depth level and you can access the information stored in the upper level, but not the one below.
What does it mean to be a structural framework?
The fact that Angular is a structural framework allows us to use HTML as a template language, and extend its syntax to express the components of the application in a cleaner and simpler way.
As an example, let’s see this case, where we obtain the value of an entry:
HTML:<input id="”input-data”" type="”text”" /> Code: document.getElementById(“input-data”).value
HTML : <input type="“text”" /> Code : $scope.inputData;
While Angular has received a lot of attention, it’s still important to decide whether it makes sense to use it for your web application. As a result, it’s important to keep in mind the conditions of the application that we want to make.
It is convenient to use Angular when making an application that fits the following characteristics:
It uses MVC, where the model communicates with the database, and so the variables defined in the controller are modified and the view is updated.
This is one of the tools that Angular provides in the defined context (scope) to work later.
When we define a controller, a new scope is created and can only access the variables we have chosen.
The driver is not used to:
A module is a container for controllers, services, filters, directives. It gives structure to your application, since it represents different parts of it.
A module can be used again and, in any order, since they can slow down the execution time. It is also excellent for unit tests because you have to refer to a single module.
It is what the user sees, it shows the functionality of our application.
A directive transforms the DOM elements to add functionality. Angular has its own directives from the beginning.
It is a solution for communication to the database and the exchange of information among the different components of the application.
They are singleton, which means that instances are created only when necessary. When the URL changes in the browser, all the controllers associated with that URL disappear, but not a service, so the data remains.
For this, I am going to refer to an excellent blog post (AngularJS: Factory vs Service vs Provider) that explains things in an easy way and talks about two of the three types. (I recommend reading the whole article)
Ok that’s it for now! I hope you learnt something from this post. Please share it, I will be writing more in the future, so stay tuned.
July 08 / 2020
April 23 / 2020
As we gradually get used to our new COVID-19 reality, daily life from just a few weeks ago now feels like a lifetime away. For businesses this has created,...Read post