Use explicit dependency declaration to protect from minification, tweak

promise explanation in README

Author: anantn

README.md

@@ -38,9 +38,11 @@ will instantly update the local model.
 Set `angularFire` as a service dependency in your controller:
 
 ```js
-myapp.controller('MyCtrl', function MyCtrl($scope, angularFire) {
-  ...
-});
+myapp.controller('MyCtrl', ['$scope', 'angularFire',
+  function MyCtrl($scope, angularFire) {
+    ...
+  }
+]);
 ```
 
 Bind a Firebase URL to any model in `$scope`:
@@ -58,13 +60,23 @@ Use the model in your markup as you normally would:
 </ul>
 ```
 
-To add or remove items, simply edit the model (a JavaScript array by default)
-after the promise has completed:
+Data from Firebase is loaded asynchronously, so make sure you edit the model
+*only after the promise has been fulfilled*. You can do this using the `then`
+method (See the
+[Angular documentation on $q](http://docs.angularjs.org/api/ng.$q)
+for more no how promises work).
+
+Place all your logic that will manipulate the model like this:
 
 ```js
 $scope.items.then(function() {
-  // Add a new item by simply modifying the array.
+  // Add a new item by simply modifying the model directly.
   $scope.items.push({name: "Firebase", desc: "is awesome!"});
+  // Or, attach a function to $scope that will let a directive in markup manipulate the model.
+  $scope.removeItem = function() {
+    $scope.items.splice($scope.toRemove, 1);
+    $scope.toRemove = null;
+  };
 });
 ```
 

examples/chat/app.js

@@ -1,16 +1,18 @@
 
 angular.module('chat', ['firebase']).
-controller('Chat', function($scope, $timeout, angularFireCollection) {
-  var el = document.getElementById("messagesDiv");
-  var url = 'https://angularFire.firebaseio-demo.com/chat';
-  $scope.messages = angularFireCollection(url, function() {
-    $timeout(function() { el.scrollTop = el.scrollHeight; });
-  });
-  $scope.username = 'Guest' + Math.floor(Math.random()*101);
-  $scope.addMessage = function() {
-    $scope.messages.$add({from: $scope.username, content: $scope.message}, function() {
-      el.scrollTop = el.scrollHeight;
+controller('Chat', ['$scope', '$timeout', 'angularFireCollection',
+  function($scope, $timeout, angularFireCollection) {
+    var el = document.getElementById("messagesDiv");
+    var url = 'https://angularFire.firebaseio-demo.com/chat';
+    $scope.messages = angularFireCollection(url, function() {
+      $timeout(function() { el.scrollTop = el.scrollHeight; });
     });
-    $scope.message = "";
+    $scope.username = 'Guest' + Math.floor(Math.random()*101);
+    $scope.addMessage = function() {
+      $scope.messages.$add({from: $scope.username, content: $scope.message}, function() {
+        el.scrollTop = el.scrollHeight;
+      });
+      $scope.message = "";
+    }
   }
-});
+]);

examples/todomvc/js/controllers/todoCtrl.js

@@ -6,22 +6,24 @@
  * - retrieves and persist the model via the todoStorage service
  * - exposes the model to the template and provides event handlers
  */
-todomvc.controller('TodoCtrl', function TodoCtrl($scope, $location, angularFire, filterFilter) {
-	var url = "https://angularFire.firebaseio-demo.com/todomvc";
-	$scope.todos = angularFire(url, $scope, 'todos');
+todomvc.controller('TodoCtrl', ['$scope', '$location', 'angularFire', 'filterFilter',
+	function TodoCtrl($scope, $location, angularFire, filterFilter) {
+		var url = "https://angularFire.firebaseio-demo.com/todomvc";
+		$scope.todos = angularFire(url, $scope, 'todos');
 
-	$scope.newTodo = '';
-	$scope.editedTodo = null;
+		$scope.newTodo = '';
+		$scope.editedTodo = null;
 
-	if ($location.path() === '') {
-		$location.path('/');
-	}
-	$scope.location = $location;
+		if ($location.path() === '') {
+			$location.path('/');
+		}
+		$scope.location = $location;
 
-	$scope.todos.then(function(todos) {
-		startWatch($scope, filterFilter);
-	});
-});
+		$scope.todos.then(function(todos) {
+			startWatch($scope, filterFilter);
+		});
+	}
+]);
 
 function startWatch($scope, filter) {
 	$scope.$watch('todos', function () {