JSFiddle - React, Tailwind, and code Playground

HTML

<div ng-app="MY_APP">
  <div ng-controller="MyCtrl">
   <button class="btn btn-primary" ng-click="edit = true">Edit</button>
  <form name="userForm" novalidate ng-submit="submit(people)">
     <div class="people-view">
     <h2 class="name">
     <span ng-show="!edit">{{people.name}}</span>
     <input ng-show="edit == true" ng-model="people.name" >
     <button type="submit" ng-click="submitted = true">Submit</button>
     </h2>
     <h2 class="name">
     <span class="title">
     <span ng-show="!edit">{{people.title}}</span>
     <input ng-show="edit" ng-model="people.title" >
     </span></h2>
      <h2 class="name">
     <span class="date">
     <span ng-show="!edit">{{people.date}} </span>
     <input ng-show="edit" ng-model="people.date"></span>
</h2>


      </div>
    <button type="submit" ng-click="submitted = true">Submit</button>
</form>
</div>
</div>

JavaScript

var app = angular.module("MY_APP", []);
app.controller("MyCtrl", function($scope) {
  $scope.submitted = false;
  $scope.edit = false;
  $scope.people = {
  name:'sai',
  title:'developer',
  'date':'14-04-2017'
  }
  $scope.submit = function(people){
  	console.log(people);
    $scope.edit = false;
    $scope.submitted = false;
  }
});