AngularJS tutorial for beginners - Introduction to AngularJS 2016

AngularJS tutorial for beginners - Introduction to AngularJS 2016
please visit that link for work.

Let's face it, writing web applications is hard. Battling to make a functional front-end is one of the biggest pain points. AngularJS eases this pain. The learning curve may be steep, but we'll break down the complexities in plain English to get you up and running in no time. By the end of this tutorial you'll be armed with all of reasons to use Angular and have built an Angular app in around 20 lines of JavaScript code.
Prerequisites
The only requirement for this tutorial is a basic understanding of front-end languages such as HTML, CSS, and JavaScript. If you've worked with jQuery before then you should be able to following along with ease.
It's all about structure
Before we get into the nitty-gritty, let's take a look at why we would want to use Angular and some of the problems it solves.
If you've ever worked on the front-end of a web app before, you've probably written code that looks like this:

In the snippet above we are just simply adding a click handler to a button that just handles adding a new todo to a todo list. Even though this is just a simple example it's soaked with bad practices.
Imperative
The good news is that our JavaScript (using jQuery in this case) is unobtrusive. This means that it's separated from our HTML. The bad part is, without looking at the JavaScript code we have no idea that the button has a click handler attached to it.
This is referred to as imperative programming. The statement (the click handler) changes the state web application by creating a flow that appends new elements to a list.
In web development this can be seen as a negative because it can hide important functionality.
Direct DOM manipulation
Every time you directly insert a HTML element into a page, an angel loses its wings. The DOM is a fickle creature.