JSFiddle - React, Tailwind, and code Playground

by chrisguzman

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.min.js"></script>
<script src="https://cdn.firebase.com/js/client/1.0.17/firebase.js"></script>
<script src="https://cdn.firebase.com/libs/angularfire/0.7.1/angularfire.min.js"></script>
<!--The purpose is to build a three way data bindings where data can be updated in firebase from the front end javascript. In order to do this, Angular JS needs to be used. To do this, first create the div for the section, which needs to contain ng-app and ng-controller. ng-app connects witht the javascript that contains the controller, and controller refers to the controller of the app. Not sure why not just use 1 instead of the other unelss there can be multiple controllers within one app, which would be pretty insane. The controller function needs to contain teh scope and firebase arguments. You can pull from teh database this list of items by just defining the reference to the Firebase URL and then setting $scope.data to $firebase(ref); Ref is the reference URL. My main question is how do you create the interaction between these two, and how do you -->
<section ng-app="myapp" ng-controller="MyController">
    <div ng-repeat="item in data">
        <!--This pulls only the values of the tree in the key value pairs within firebase. In the case where thre data structure tree has a branch and then the key-value pairs, the entire dictionary is pulled. It's a full dictionary with out the first branch essentially. The following pulls the query in. How do I then edit this query based on that-->
         <h5 ng-cloak>{{item.subject}}</h5>

         <h5 ng-cloak>{{item.query}}</h5>

    </div>
</section>

JavaScript

var myapp = angular.module("myapp", ["firebase"])
    .controller('MyController', function MyController($scope, $firebase) {
    var furl = "https://mandrillemail.firebaseio.com/emailquery";
    var ref = new Firebase(furl);
    $scope.data = $firebase(ref);
});