AngularJS lesson 4 - linking form controls to multidimensional JSON

in #utopian-io8 years ago (edited)

What Will I Learn?

  • You will learn how to construct a JSON variable containing multiple arrays, and how to output a specific array element to the page.
  • You will learn to use the ng-model directive to link an inputbox value to a JSON array index, so changing the value in the input box will output a specific element in the JSON array.
  • You will learn to use dropdown menus to select elements from the JSON array.
  • You will learn how to remove the empty cell at the top of the dropdown menu.

Requirements

  • I am using Microsoft Visual Studio 2017 Community Edition (has IntelliSense for AngularJS and allows you to test the application using a local web server) running under Windows 10. Download Visual Studio here: https://www.visualstudio.com/downloads/
  • You can still follow the tutorial with another text editor but you will need to find another way to test your application on a web server.

Difficulty

Intermediate
You should already be familliar with HTML, CSS and Javascript, otherwise you may find these tutorials difficult.

Description

In this series of tutorials you will learn how to make a dynamic Single Page Application (SPA) with AngularJS. This means that the user will not be loading entire new pages on the server. Instead, appropriate resources are dynamically loaded onto the page as necessary in response to user actions.

Video Tutorial

Curriculum



Posted on Utopian.io - Rewarding Open Source Contributors

Sort:  

Hey @magicmonk I am @utopian-io. I have just upvoted you!

Achievements

  • Seems like you contribute quite often. AMAZING!

Community-Driven Witness!

I am the first and only Steem Community-Driven Witness. Participate on Discord. Lets GROW TOGETHER!

mooncryption-utopian-witness-gif

Up-vote this comment to grow my power and help Open Source contributions like this one. Want to chat? Join me on Discord https://discord.gg/Pc8HG9x

thank you utopian!

Thank you for the contribution. It has been approved.

You can contact us on Discord.
[utopian-moderator]

Thank you so much @ewq!!

Thank you @magicmonk ! I just want to offer you a big thumbs up for your great info you have right here about #AngularJS. its a great leasson and very good informative tutorial.
Specially the topic u cover dropdown menus to select elements from the JSON array is really fantastic . I really love to watch and learn many things from your video . Thank you