Using AngularJS ng-model vs pure-JS equivalent for total beginners

Last Updated on

As with learning any technology, you need to know the basics. More importantly, you must see them with your mind and relate how an idea works to things you are already familiar with. No point of memorizing them if you cannot absorb them.

So, a colleague of mine asked me to teach her some basic AngularJS stuff but I did not have time. I told here I could guide her and she can ask me questions via Skype chat. The first question was about ng-model.

This short post is about the ng-model described in very simple terms and examples – plain JavaScript and AngularJS implementations – to attain the same thing.

Old school JavaScript

Do you remember when you were just starting working on JavaScript? Or worse, started working on a relatively large project with a lot of messy JavaScript codes? Nowadays, web UI projects use one or more JavaScript frameworks to speed up development and relatively ease maintenance (because your codes follow the “pattern” allowed by a framework).

Here is a sample JavaScript codes that take in a string for name and display it both as an inline text and alert message.

Using AngularJS

Below are equivalent codes using AngularJS.

Download the files

You may download the files here https://www.dropbox.com/s/mazlaq5x6anga4s/ng-model-0001.zip?dl=0


Karl San Gabriel

Professional Software Developer