JSFiddle - React, Tailwind, and code Playground
HTML
<div ng-controller="DataEntryCtrl">
<span ng-repeat="entryField in entryFields">
<input type="text"
ng-model="entryField.fieldData"
placeholder="{{entryField.pHolder}}">
</span>
<input type="button" ng-click="sendJSON()" value="Object To JSON" />
<hr/>
{{res}}
<ul>
<li>ID: {{entryFields.id.fieldData}}</li>
<li>description: {{entryFields.description.fieldData}}</li>
<li>date: {{entryFields.date.fieldData}}</li>
</ul>
{{json}}
</div>
JavaScript
'use strict';
/* Controllers */
var app = angular.module('Hubbub-FrontEnd', ['ngResource']);
app.controller('DataEntryCtrl', function($scope,$resource) {
$scope.entryFields = {
id: {pHolder:'ID goes here',fieldData:""},
description: {pHolder:'Description goes here',fieldData:""},
date: {pHolder:'Drop Dead Date goes here',fieldData:""}
};
$scope.showJSON = function() {
$scope.json = angular.toJson($scope.entryFields);
};
$scope.sendJSON = function() {
$scope.entry = angular.toJson($scope.entryFields);
$scope.res = $resource('http://10.64.16.6:3000/Create',
{create:{method:'POST'}},{params:$scope.entry});
};
});