Angular: Empty Fiddle

http://angularjs.org/

by dberringer

HTML

<script src="https://cdn.firebase.com/js/client/1.0.17/firebase.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.min.js"></script>
<script src="https://cdn.firebase.com/libs/angularfire/0.7.1/angularfire.min.js"></script>
<div ng-controller="MyCtrl">
    <div>Hello, {{foo.thing1}}!</div>
    <input type="text" ng-model="foo.thing1"/>
    <button ng-click="save1()">Save 1</button>

    <div>Hello, {{bar.thing1}}!</div>
    <input type="text" ng-model="bar.thing1"/>
    <button ng-click="save2()">Save 2</button>

    <div>Hello, {{bas.thing1}}!</div>
    <input type="text" ng-model="bas.thing1"/>
    <button ng-click="saveBas()">Save 3</button>

    <div>Hello, {{biz.thing1}}!</div>
    <input type="text" ng-model="biz.thing1"/>
    <button ng-click="saveBiz()">Save 4</button>
</div>

JavaScript

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

function MyCtrl($scope, $firebase) {
    var ref1 = $firebase(new Firebase("https://fiddler.firebaseio.com/test1"));
    ref1.$on('value', function () {
        $scope.foo = ref1;
    });
    
    $scope.save1 = function () {
        ref1.$save();
    };
    
    var ref2 = $firebase(new Firebase("https://fiddler.firebaseio.com/test1"));
    ref2.$on('value', function () {
        $scope.bar = ref2;
    });
    
    $scope.save2 = function () {
        ref2.$save();
    };
    
    $scope.bas = $firebase(new Firebase("https://fiddler.firebaseio.com/test1"));
    $scope.saveBas = function () {
        $scope.bas.$save();
    };
    
    $scope.biz = $firebase(new Firebase("https://fiddler.firebaseio.com/test1"));
    $scope.saveBiz = function () {
        $scope.biz.$save();
    };
}