JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.min.js"></script>
<div ng-app="editGlossaryApp">
    <div ng-controller="MainCtrl">
        <div>
            <button ng-click="addNewDefinition()">Add New Item</button>
        </div>
        <div>
            <label>Term:</label>
            <div>
                <input value="{{GlossaryItem.Term}}" />
            </div>
        </div>
        <div>
            <label>Definition:</label>
            <div>
                <textarea rows="16" cols="60">{{GlossaryItem.Definition}}</textarea>
            </div>
        </div>
        <div>
            <button ng-click="fill()">Click Me</button>
        </div>
    </div>
</div>

JavaScript

var app = angular.module('editGlossaryApp', []);

app.controller('MainCtrl', ['$scope', function ($scope) {
    $scope.GlossaryItem = {
        Id: 0,
        Term: '',
        Definition: ''
    };

    $scope.addNewDefinition = function () {
        debugger;
        $scope.GlossaryItem = {
            Id: 0,
            Term: '',
            Definition: ''
        };
    };
    
    $scope.fill = function(){
    	$scope.GlossaryItem = {
            Id: 1,
            Term: 'Test',
            Definition: 'Definition Definition Definition Definition Definition Definition'
        };
    }
}]);