标签: angularfire2

我正在尝试在 firebase 中创建/更新购物车。我使用的服务具有将 localStorage ID 添加到 firebase 的功能，如果产品已经存在，它会添加购物车中的数量，否则它会创建新的。错误发生在控制台TypeError: Cannot read property 'quantity' of null并且我在购物车 service.ts 中编译时也遇到错误：

1. “Observable<{}>”类型上不存在属性“update”。
2. 类型“{}”上不存在属性“数量”

下图展示了我试图在 firebase 中获得的内容：

购物车.service.ts

import { take } from 'rxjs/operators';
import { AngularFireDatabase, snapshotChanges } from 'angularfire2/database';
import { Injectable } from '@angular/core';
import { Product } from './models/product';

@Injectable({
  providedIn: 'root'
})
export class ShoppingCartService {

  constructor(private db: AngularFireDatabase) { }

  private create(){
    console.log('shoping service')
   return this.db.list('/shopping-carts').push({
      dateCreated: new Date().getTime()
    });
  }

 private getCart(cartId: string){
   return this.db.object('/shoping-carts/'+ cartId);
 } …

我已经为此工作了一天，但我根本无法让它工作。我建立了一个没有安全规则的数据库：

然后我尝试在我的 angular fire 应用程序中访问它：

this.afDatabase
    .object("/test/test")
    .snapshotChanges()
    .subscribe(x => {
        console.log(x);
    });

但我仍然收到以下权限错误：

错误：permission_denied at /test/test：客户端无权访问所需数据。

我还运行了模拟器并获得了成功的结果：

我还设置了我的 environment.ts 文件：

难道我做错了什么？

我正在尝试将具有出生日期和激活日期的人的个人信息保存到 Angular 的 Firestore 数据库中；

但是，传递带有Date()类型字段的对象，日期将保存为字符串：

this.treatment.activationDate = new Date();
// gives such result in firestore with string type
// activationDate: "2018-11-16T09:48:51.137Z"

还尝试使用服务器时间戳，但以下方法未返回有效值：

firebase.firestore.FieldValue.serverTimestamp()

结果在 Firestore（不允许上传图片抱歉:)）：

activationDate: (map)
     _methodName: FieldValue.serverTimestamp 

但是，此方法无法为我提供自定义日期的时间戳（例如birthDate） 那么使用angular 在firestore 中将日期保存为时间戳对象的最佳方法是什么？

.....
import  * as firebase from 'firebase';
.....
export class AddPatientComponent implements OnInit { 
......

this.treatment.activationDate = new Date();
  //firebase.firestore.FieldValue.serverTimestamp();
  console.log("timestamp: ", this.treatment.activationDate,                  firebase.firestore.FieldValue.serverTimestamp()); 
  this.patientService.savePatient(this.patient, this.treatment,   this.courseMeds);

还有一个模型：

export class CourseMed{
  amountPerDay: number;
  atc: String;
  name: String;
  days: number;
  dosage: number;
  form: …

我有角度，angularfire2 我有错误

未处理的承诺拒绝：无法在“IDBDatabase”上执行“交易”：数据库连接正在关闭。; 区域： ; 任务： Promise.then ；值：DOMException：无法在“IDBDatabase”上执行“事务”：数据库连接正在关闭。

我的简单代码是

import { Component } from '@angular/core';
import { AngularFirestore } from '@angular/fire/firestore';
import { Observable, from } from 'rxjs';
import { map } from 'rxjs/operators';
import { Trip } from '../models/Trip';

@Component({
  selector: 'app-root',
  template: `
  <ul>
    <li *ngFor="let item of items | async">
      {{ item.tripname }}
    </li>
  </ul>
  `
})
export class TestpageComponent {

  items: Observable<any[]>;
  constructor(db: AngularFirestore) {
    this.items = db.collection('trips').snapshotChanges().pipe(
      map(actions => actions.map(a => {
        const data = …

在 Firestore 中，我有一个具有数组类型属性（名为“items”）的文档。该数组包含ShoppingItem具有以下结构的对象：

export class ShoppingItem {
 id?: string; 
 name: string;
 checked = false;
}

为了完成起见，在文档结构下方：

export interface ShoppingList {
 id: string;
 name?: string;
 items: ShoppingItem[]; // <-- This is the array property I am updating
}  

从用户界面，用户可以更新checked对象的属性，我想相应地更新数据库。我从 Firebase 文档中读到，我们可以使用它arrayRemove/arrayUnion以原子方式删除/添加数组项。

为了更新现有项目，我是否必须删除旧对象并每次添加新对象（嵌套承诺），如下所示？或者有可能以更优雅的方式？

updateItem(listId: string, item: ShoppingItem) {
  const docRef = this.db.collection("list").doc(listId)

  return docref.update({ items: firestore.FieldValue.arrayRemove(item) })
    .then(() => {
    {
      docRef.update({ items: firestore.FieldValue.arrayUnion(item) });
    }
  });
}

在数组中删除和添加项目的另一个缺点是更新的元素在 UI 中闪烁。

每当我尝试添加时都显示错误

ng add angular/fire@next

使用命令行界面

编译@angular/fire : main 作为 umd

编译@angular/fire : 模块为 esm5

编译@angular/fire/auth : es2015 为 esm2015

编译 @angular/fire/auth : main as umd

编译 @angular/fire/auth : 模块为 esm5

编译@angular/fire/auth-guard : es2015 为 esm2015

编译@angular/fire/auth-guard : main as umd

编译 @angular/fire/auth-guard : 模块为 esm5

编译@angular/fire/database : es2015 为 esm2015

编译@angular/fire/database : main as umd

编译@angular/fire/database : 模块为 esm5

编译@angular/fire/database-deprecated : es2015 为 esm2015

编译@angular/fire/database-deprecated : main as umd

错误：试图用 ngcc 备份文件覆盖 E:/portfolio/node_modules/@angular/fire/bundles/database.umd.js.__ivy_ngcc_bak，这是不允许的。在 InPlaceFileWriter.writeFileAndBackup (E:\portfolio\node_modules@angular\compiler-cli\ngcc\src\writing\in_place_file_writer.js:36:23) 在 E:\portfolio\node_modules@angular\compiler-cli\ngcc\src\写入\in_place_file_writer.js:30:69 at Array.forEach () …

我想使用 AngularFire 读取 Firebase Firestore 中的特定文档。

import { Component, OnInit } from '@angular/core'; 
import { ActivatedRoute } from '@angular/router';
import { AngularFirestore , AngularFirestoreCollection, AngularFirestoreDocument } from 'angularfire2/firestore';
import { Observable } from 'rxjs';
import { async } from 'q';

@Component({
  selector: 'app-read-more-page',
  templateUrl: './read-more-page.component.html',
  styleUrls: ['./read-more-page.component.scss']
})
export class ReadMorePageComponent implements OnInit {
  postCatagory: string;
  databaseName: any; 
  uuid: string;

  documentObject:any; //real docum

  //observables 
  items: Observable<any[]>;
  doc  : AngularFirestoreDocument<any>
  post : Observable<any>;

  constructor(private route: ActivatedRoute , private afs: AngularFirestore ) …

我正在使用 AngularFire 和 Angular 8 来构建一个应用程序，但我有一个愚蠢的问题（我认为这实际上很愚蠢）。

我构建了一个简单的服务来包装AngularFireAuth：

import { Injectable } from '@angular/core';
import { AngularFireAuth } from '@angular/fire/auth';
import { User } from 'firebase';
import { Subject } from 'rxjs';
import { MessageService } from 'primeng/api';

@Injectable({
  providedIn: 'root'
})
export class AuthService {
  private user: Subject<User> = new Subject();
  private isLoggedIn: Subject<boolean> = new Subject();

  constructor(private afAuth: AngularFireAuth, private messageService: MessageService) {
    this.afAuth.auth.onAuthStateChanged(user => {
      this.user.next(user);
      this.isLoggedIn.next(user !== null);
    });
  }

  isAuthenticated() {
    return this.isLoggedIn.asObservable();
  } …

我现在处理这个问题已经快两周了。我尝试了很多解决方法，但似乎没有一个有效。我已经安装angular-fire并安装firebase到它的最新版本，尝试过ng add @angular/fire，配置自定义webpack.config.ts，尝试回滚到每个建议的先前版本。没有人解决这个问题。

实际错误：

de-10@de10-LIFEBOOK-A555:~/Desktop$ node dist/server.js 
internal/modules/cjs/loader.js:797
    throw err;
    ^

Error: Cannot find module 'firebase/app'
Require stack:
- /home/de-10/Desktop/dist/server.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:794:15)
    at Function.Module._load (internal/modules/cjs/loader.js:687:27)
    at Module.require (internal/modules/cjs/loader.js:849:19)
    at require (internal/modules/cjs/helpers.js:74:18)
    at Object.<anonymous> (/home/de-10/Desktop/dist/server.js:125276:18)
    at __webpack_require__ (/home/de-10/Desktop/dist/server.js:20:30)
    at Module.<anonymous> (/home/de-10/Desktop/dist/server.js:125199:70)
    at __webpack_require__ (/home/de-10/Desktop/dist/server.js:20:30)
    at Module.<anonymous> (/home/de-10/Desktop/dist/server.js:124984:78)
    at __webpack_require__ (/home/de-10/Desktop/dist/server.js:20:30) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [ '/home/de-10/Desktop/dist/server.js' ]
}

我不能放弃 Firebase 因为然后我面临：

ERROR in ../node_modules/@angular/fire/auth/auth.d.ts:4:28 - error TS2307: Cannot find module 'firebase/app'.

4 …

在Background Web Notification我的服务中实施 FCM 时出现以下错误

error TS2339: Property 'messaging' does not exist on type 'AngularFireMessaging'

消息服务.ts

import { Injectable } from '@angular/core';
import { AngularFireMessaging } from '@angular/fire/messaging';
import { BehaviorSubject } from 'rxjs'

@Injectable()
export class MessagingService {
    currentMessage = new BehaviorSubject(null);
    constructor(private angularFireMessaging: AngularFireMessaging) {
         this.angularFireMessaging.messaging.subscribe(
             (_messaging) => {
                 _messaging.onMessage = _messaging.onMessage.bind(_messaging);
                 _messaging.onTokenRefresh = _messaging.onTokenRefresh.bind(_messaging);
             }
         )
    }
}

src/firebase-messaging-sw.js

importScripts('https://www.gstatic.com/firebasejs/7.14.6/firebase-app.js');
importScripts('https://www.gstatic.com/firebasejs/7.14.6/firebase-messaging.js');


firebase.initializeApp({
    apiKey: "xxxxxxxxxxx",
    authDomain: "xxxxxxxxxxx",
    databaseURL: "xxxxxxxxxxx",
    projectId: "xxxxxxxxxxx",
    storageBucket: "xxxxxxxxxxx",
    messagingSenderId: "xxxxxxxxxxx",
    appId: …