Merge branch 'master' into @somombo/add-list-set

Author: jamesdaniels

.gitignore

@@ -6,3 +6,4 @@ typings/
 npm-debug.log
 .idea/
 .vscode/settings.json
+angularfire2-*.tgz

CHANGELOG.md

@@ -1,3 +1,32 @@
+<a name="4.0.0-rc.1"></a>
+# [4.0.0-rc.1](https://github.com/angular/angularfire2/compare/4.0.0-rc.0...v4.0.0-rc.1) (2017-06-02)
+
+### Breaking changes
+
+* **rc:** Update to Firebase JS SDK 4.0 ([9642f5](https://github.com/angular/angularfire2/commit/9642f589ba73add6d49a5818a1109028f8c7729b))
+
+In version 4.0 of the Firebase SDK `onAuthStateChanged` is only fired on sign-in and sign-out, [see the Firebase JS SDK changelog for more information.](https://firebase.google.com/support/release-notes/js#4.0.0). The added `AngularFireAuth.idToken: Observable<firebase.User>` behaves as `authState` used to.
+
+<a name="4.0.0-rc0"></a>
+# [4.0.0-rc0](https://github.com/angular/angularfire2/compare/2.0.0-beta.8...v4.0.0-rc0) (2017-05-02)
+
+
+### Bug Fixes
+
+* **auth:** Use the injected app ([980c447](https://github.com/angular/angularfire2/commit/980c447))
+* **build:** Add package.json files for deep paths ([cd5f2d1](https://github.com/angular/angularfire2/commit/cd5f2d1)), closes [#880](https://github.com/angular/angularfire2/issues/880)
+* **database:** Fix test TypeScript errors ([750737c](https://github.com/angular/angularfire2/commit/750737c)), closes [#875](https://github.com/angular/angularfire2/issues/875)
+* **database:** use switchMap when a list's query changes ([#831](https://github.com/angular/angularfire2/issues/831)) ([b85147d](https://github.com/angular/angularfire2/commit/b85147d)), closes [#830](https://github.com/angular/angularfire2/issues/830)
+
+
+### Features
+
+* **auth:** New Auth API ([12aa422](https://github.com/angular/angularfire2/commit/12aa422))
+* **database:** Add AngularFireDatabaseModule ([b388627](https://github.com/angular/angularfire2/commit/b388627))
+* **database:** support optional endAt/equalTo key ([#838](https://github.com/angular/angularfire2/issues/838)) ([e146492](https://github.com/angular/angularfire2/commit/e146492)), closes [#837](https://github.com/angular/angularfire2/issues/837)
+* **rc:** Implement rc0 API ([398e4e2](https://github.com/angular/angularfire2/commit/398e4e2))
+
+
 <a name="2.0.0-beta.8"></a>
 # [2.0.0-beta.8](https://github.com/angular/angularfire2/compare/2.0.0-beta7...v2.0.0-beta.8) (2017-02-16)
 

README.md

@@ -14,10 +14,12 @@ Status: Beta
 - **Authentication** - Monitor authentication state in realtime.
 
 #### Quick links
-[Contributing](https://github.com/angular/angularfire2/blob/master/CONTRIBUTING.md)
+[Contributing](CONTRIBUTING.md)
 
 [Plunker Template](http://plnkr.co/edit/8yY4tH?p=preview) - Requires to set your Firebase credentials in `app.module.ts`.
 
+[Upgrading to v4.0? Check out our guide.](docs/version-4-upgrade.md)
+
 ## Install
 
 ```bash
@@ -28,7 +30,7 @@ npm install firebase angularfire2 --save
 
 ```ts
 import {Component} from '@angular/core';
-import {AngularFire, FirebaseListObservable} from 'angularfire2';
+import {AngularFireDatabase, FirebaseListObservable} from 'angularfire2/database';
 
 @Component({
   selector: 'project-name-app',
@@ -42,8 +44,8 @@ import {AngularFire, FirebaseListObservable} from 'angularfire2';
 })
 export class MyApp {
   items: FirebaseListObservable<any[]>;
-  constructor(af: AngularFire) {
-    this.items = af.database.list('/items');
+  constructor(db: AngularFireDatabase) {
+    this.items = db.list('/items');
   }
 }
 ```
@@ -59,3 +61,4 @@ productive with AngularFire2.
 4. [Querying lists](docs/4-querying-lists.md)
 5. [User Authentication - FirebaseAuthentication](docs/5-user-authentication.md)
 6. [Using AngularFire2 with Ionic 2](docs/Auth-with-Ionic2.md)
+7. [Using AngularFire2 with Ionic 3 and Angular 4](docs/Auth-with-Ionic3-Angular4.md)

docs/1-install-and-setup.md

@@ -2,6 +2,8 @@
 
 > Getting started with AngularFire2 is easy with the [Angular CLI](https://github.com/angular/angular-cli). Follow the 10 steps below to get started. Don't worry, we're always working to make this shorter.
 
+> Using Ionic and the Ionic CLI? Check out these [specific instructions](6-angularfire-and-ionic-cli.md) for Ionic and their CLI.
+
 ### 0. Prerequisites
 
 Before you start installing AngularFire2, make sure you have latest version of angular-cli installed.
@@ -56,7 +58,25 @@ npm install angularfire2 firebase --save
 
 Now that you have a new project setup, install AngularFire2 and Firebase from npm.
 
-### 4. Setup @NgModule
+### 4. Add Firebase config to environments variable
+
+Open `/src/environments/environment.ts` and add your Firebase configuration:
+
+```ts
+export const environment = {
+  production: false,
+  firebase: {
+    apiKey: '<your-key>',
+    authDomain: '<your-project-authdomain>',
+    databaseURL: '<your-database-URL>',
+    projectId: '<your-project-id>',
+    storageBucket: '<your-storage-bucket>',
+    messagingSenderId: '<your-messaging-sender-id>'
+  }
+};
+```
+
+### 5. Setup @NgModule for the AngularFireModule
 
 Open `/src/app/app.module.ts`, inject the Firebase providers, and specify your Firebase configuration.
 This can be found in your project at [the Firebase Console](https://console.firebase.google.com):
@@ -66,20 +86,12 @@ import { BrowserModule } from '@angular/platform-browser';
 import { NgModule } from '@angular/core';
 import { AppComponent } from './app.component';
 import { AngularFireModule } from 'angularfire2';
-
-// Must export the config
-export const firebaseConfig = {
-  apiKey: '<your-key>',
-  authDomain: '<your-project-authdomain>',
-  databaseURL: '<your-database-URL>',
-  storageBucket: '<your-storage-bucket>',
-  messagingSenderId: '<your-messaging-sender-id>'
-};
+import { environment } from '../environments/environment';
 
 @NgModule({
   imports: [
     BrowserModule,
-    AngularFireModule.initializeApp(firebaseConfig)
+    AngularFireModule.initializeApp(environment.firebase)
   ],
   declarations: [ AppComponent ],
   bootstrap: [ AppComponent ]
@@ -95,55 +107,87 @@ You can optionally provide a custom FirebaseApp name with `initializeApp`.
 @NgModule({
   imports: [
     BrowserModule,
-    AngularFireModule.initializeApp(firebaseConfig, authConfig, 'my-app-name')
+    AngularFireModule.initializeApp(environment.firebase, 'my-app-name')
   ],
   declarations: [ AppComponent ],
   bootstrap: [ AppComponent ]
 })
 export class AppModule {}
 ```
 
+### 6. Setup individual @NgModules
+
+After adding the AngularFireModule you also need to add modules for the individual @NgModules that your application needs.
+ - AngularFireAuthModule
+ - AngularFireDatabaseModule
+ - AngularFireStorageModule (Future release)
+ - AngularFireMessagingModule (Future release)
+
+#### Adding the Firebase Database and Auth Modules
+
+For example if your application was using both Firebase authentication and the Firebase database you would add:
+
+```ts
+import { BrowserModule } from '@angular/platform-browser';
+import { NgModule } from '@angular/core';
+import { AppComponent } from './app.component';
+import { AngularFireModule } from 'angularfire2';
+import { AngularFireDatabaseModule } from 'angularfire2/database';
+import { AngularFireAuthModule } from 'angularfire2/auth';
+import { environment } from '../environments/environment';
+
+@NgModule({
+  imports: [
+    BrowserModule,
+    AngularFireModule.initializeApp(environment.firebase, 'my-app-name'), // imports firebase/app needed for everything
+    AngularFireDatabaseModule, // imports firebase/database, only needed for database features
+    AngularFireAuthModule, // imports firebase/auth, only needed for auth features
+  ],
+  declarations: [ AppComponent ],
+  bootstrap: [ AppComponent ]
+})
+export class AppModule {}
+
+```
 
-### 5. Inject AngularFire
+### 7. Inject AngularFireDatabase
 
 Open `/src/app/app.component.ts`, and make sure to modify/delete any tests to get the sample working (tests are still important, you know):
 
 ```ts
 import { Component } from '@angular/core';
-import { AngularFire, FirebaseListObservable } from 'angularfire2';
+import { AngularFireDatabase, FirebaseListObservable } from 'angularfire2/database';
 
 @Component({
-
   selector: 'app-root',
   templateUrl: 'app.component.html',
   styleUrls: ['app.component.css']
 })
 export class AppComponent {
-  constructor(af: AngularFire) {
+  constructor(db: AngularFireDatabase) {
 
   }
 }
 
 ```
 
-### 6. Bind to a list
+### 8. Bind to a list
 
 In `/src/app/app.component.ts`:
 
 ```ts
 import { Component } from '@angular/core';
-import { AngularFire, FirebaseListObservable } from 'angularfire2';
+import { AngularFireDatabase, FirebaseListObservable } from 'angularfire2/database';
 
 @Component({
-
   selector: 'app-root',
   templateUrl: 'app.component.html',
   styleUrls: ['app.component.css']
 })
 export class AppComponent {
   items: FirebaseListObservable<any[]>;
-  constructor(af: AngularFire) {
-    this.items = af.database.list('/items');
+  constructor(db: AngularFireDatabase) {
+    this.items = db.list('/items');
   }
 }
 ```
@@ -158,7 +202,7 @@ Open `/src/app/app.component.html`:
 </ul>
 ```
 
-### 7. Run your app
+### 9. Run your app
 
 ```bash
 ng serve