Skip to content

Instantly share code, notes, and snippets.

@shiftregister-vg

shiftregister-vg/index.html

Created July 3, 2014 18:24
Show Gist options
  • Save shiftregister-vg/609c6648aab7b563b831 to your computer and use it in GitHub Desktop.
Save shiftregister-vg/609c6648aab7b563b831 to your computer and use it in GitHub Desktop.
Download ZIP
A simple shout box application written with Angular.js and Firebase (AngularFire)
Raw
index.html
<!DOCTYPE html>
<html ng-app="myapp">
<head lang="en">
<meta charset="UTF-8">
<title>AngularFire Demo</title>
<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>
<link rel="stylesheet" type="text/css" href="https://www.firebase.com/css/example.css">
</head>
<body ng-controller="MyController">
<div id="messagesDiv"><div ng-repeat="msg in messages"><em>{{msg.from}}</em>: {{msg.body}}</div></div>
<input type="text" ng-model="name" placeholder="Name"/>
<input type="text" ng-model="msg" ng-keydown="addMessage($event)" placeholder="Message..."/>
<script>
var app = angular.module("myapp", ["firebase"]);
function MyController($scope, $firebase) {
var ref = new Firebase('https://sgangularfiredemo.firebaseio.com/');
$scope.messages = $firebase(ref);
$scope.addMessage = function(e) {
if (e.keyCode != 13) return;
$scope.messages.$add({from: $scope.name, body: $scope.msg});
$scope.msg = "";
}
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment