Angular - ng-model Demo

ng-model, ng-show, ng-click, ng-submit

by Marventus

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<h2>My AngularJS Form</h2>
<div ng-app="myApp">
  <form id="myForm" name="myForm">
    <div class="form-group">
      <input id="firstName" name="firstName" type="text" placeholder="First Name" />
    </div>
    <div class="form-group">
      <input id="lastName" name="lastName" type="text" placeholder="Last Name" />
    </div>
    <div class="form-group">
      <input id="userEmail" name="userEmail" type="email" placeholder="Email" />
    </div>
    <button id="showInfo" name="showInfo">
      Show Info</button>
  </form>

  <div id="showAllInfo">
    <p><strong>First Name: </strong></p>
    <p><strong>Last Name: </strong></p>
    <p><strong>Email: </strong></p>
  </div>

CSS

h2 {
  text-align: center;
}

form {
  border: 1px solid #ddd;
  margin: 0 auto;
  padding: 1em;
  width: 70vw;
}

JavaScript

var app = angular.module("myApp", []);