JSFiddle - React, Tailwind, and code Playground

by Kyrylo Slatin

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.1/angular.min.js"></script>
<script src="https://cdn.firebase.com/libs/angularfire/1.1.2/angularfire.min.js"></script>
<script src="https://cdn.firebase.com/js/client/2.2.7/firebase.js"></script>
<div ng-controller="ctrlr">
    <form name="newUp">
        <input ng-model="newItem.title">
        <textarea ng-model="newItem.text"></textarea>
        <button ng-click="add(newItem)">Submit</button>
    </form>

      title: {{currentUser.item.title}} text: {{currentUser.item.text}} time: {{currentUser.item.date}}
</div>
            <hr>
<div ng-controller="ctrlr2">
    <form name="newUp">
        <input ng-model="newItem.title">
        <textarea ng-model="newItem.text"></textarea>
        <button ng-click="add(newItem)">Submit</button>
    </form>
        <div ng-repeat="item in list">
      title: {{item.title}} text: {{item.text}} time: {{item.date}}
        </div>
</div>

JavaScript

angular.module('app', []);
angular.module('app').controller('ctrlr', function ($scope, $firebaseObject, $firebaseArray) 
{
  var ref = new Firebase("https://l0v368u2p9g.firebaseio-demo.com/");

    $scope.currentUser = { item: 'empty' };
    $firebaseObject(ref).$bindTo($scope, 'currentUser');
    
    $scope.add = function(newItem){
        if (!(newItem.title && newItem.text)) return;
        var sanitized = {
          title: newItem.title,
          text: newItem.text,
          date: Firebase.ServerValue.TIMESTAMP,
        };
        $scope.currentUser.item = sanitized;
      };
    
});
angular.module('app').controller('ctrlr2', function ($scope, $firebaseObject, $firebaseArray) 
{
  var ref = new Firebase("https://l0v368u2p9g.firebaseio-demo.com/");

    $scope.currentUser = { };
    $scope.list = $firebaseArray(ref);
    
    $scope.add = function(newItem){
        if (!(newItem.title && newItem.text)) return;
        var sanitized = {
          title: newItem.title,
          text: newItem.text,
          date: Firebase.ServerValue.TIMESTAMP,
        };
        $scope.list.$add(sanitized);
      };
});
angular.bootstrap(document, ['app', 'firebase']);