cblupo
8/23/2017 - 6:33 PM

angular and firebase setup

angular and firebase setup

angularfire.js
content_copyfile_download
{{{ index.html // I'm pretty sure this filename must never change for routing to work
<!doctype html>
<html lang="en" ng-app="myApp">
<head>
<script src='https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.2/angular-route.js'></script>
<script src="https://cdn.firebase.com/js/client/2.1.0/firebase.js"></script>
<script src="https://cdn.firebase.com/libs/angularfire/0.9.1/angularfire.min.js"></script>
</head>
<body>
   <main ng-view></main>
</body
</html>
}}}


{{{ main.js
var myApp = angular.module('myApp', ['ngRoute', 'appControllers', 'firebase']);
var appControllers = angular.module('appControllers', ['firebase']);

myApp.run(['$rootScope','$location'], function($rootScope, $location){
   $rootScope.$on('$routeChangeError',function(event, next, previous, error) {
      if (error === 'AUTH_REQUIRED') {
         $location.path('/login');
      }
   });
});

myApp.config(['$routeProvider'], function($routeProvider){
   when('/login', function() {
      templateUrl: 'login.html',
      controller: 'loginController'
      controllerAs: 'vm' // vm stands for view model. don't have to inject $scope, can just use this.aVariable instead of $scope.aVariable
   }).
   when('/asdf2/:parameter1/:parameter2', function() {
      templateUrl: 'asdf2.html',
      controller: 'asdf2Controller',
      controllerAs: 'vm'
   }).
   otherwise({
      redirectTo: '/login'
   })
});
}}}

{{{ asdf2Controller.js
   myApp.controller('asdf2Controller',function($scope, $location, $firebaseAuth, $routeParams){
     var vm = this;
      // do stuff
   });
}}}