JSFiddle - React, Tailwind, and code Playground

by yogeshgadge

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.19/angular.min.js"></script>
<script src="https://cdn.firebase.com/js/client/1.0.21/firebase.js"></script>
<script src="https://cdn.firebase.com/libs/angularfire/0.8.2/angularfire.min.js"></script>
<div ng-app="myapp"><div ng-controller="articlesCtrl">
    <p>Article controller:</p>
    <ul>
        <li ng-repeat="article in articles">{{article.getComments()[0].getText()}}</li>
    </ul>

    </div></div>

JavaScript

var myapp = angular.module('myapp', ['firebase']);

myapp.factory("Article", ["$FirebaseObject", "$firebase", "$injector" ,function($FirebaseObject, $firebase, $injector) {
    var Comment = null;
    
    // create a new factory based on $FirebaseObject
    var ArticleFactory = $FirebaseObject.$extendFactory({
        // these methods exist on the prototype, so we can access the data using `this`
        
        //fixed some other unrelated error
        comments: [],
        getId: function() {
            return this.$id;
        },
        addComment: function(comment)
        {
            this.comments[comment.getId()] = true;
            comment.setArticle(this);
        },
        getComments: function()
        {
            var result = [];
            for(var key in this.comments)
                if(this.comments.hasOwnProperty(key)) {
                    if (this.Comment == null)
                        Comment = $injector.get('Comment'); 
                    result.push(new Comment(key));
                }
            return result;
        }
    });

    return function(articleId) {
        var ref = new Firebase("https://hiattp-auth-test.firebaseio.com").child('article/'+articleId);
        var sync = $firebase(ref, {objectFactory: ArticleFactory});
        return sync.$asObject();
    }
}]);

myapp.factory("Comment", ["$FirebaseObject", "$firebase","$injector", function($FirebaseObject, $firebase, $injector) {

    var Article = null;
    var CommentFactory = $FirebaseObject.$extendFactory({
        
        getId: function() {
            return this.$id;
        },
        setText: function(text) {
            this.text = text;
            return this;
        },
        getText: function() {
            return this.text;
        },
        setArticle: function(article)
        {
            this.articleId = article.getId();
        },
        getArticle: function()
        {
            if (Article == null)
                 Article =...