标签: angularfire2

我在Angular Web应用程序中使用AngularFire2.由于Firebase的查询限制,我无法形成完全提供所需数据的查询(至少在没有对我的架构进行重大更改的情况下).

所以我想在javascript(typescript)中应用额外的客户端过滤条件.我该怎么做呢？我可以以某种方式向observable添加过滤函数吗？下面是一个片段,说明了我在做什么.

在组件的HTML模板中,我有类似下面的内容.html片段中的"jobs"变量是FirebaseListObservable.

<tr *ngFor="let job of jobs | async"> 
  .. fill in the table rows

组件代码如下所示:

   // in the member declaration of the class
   jobs : FirebaseListObservable<Job[]>;

   ...
   // Notice in ngOnInit(), I'm filtering the jobs list using the the
   // Firebase criteria. But I want to filter on an additional field. 
   // Firebase allows only single field criteria, so I'm looking for 
   // a way to apply an additional client-side filter to jobs to eliminate
   // some …

我成功地从托管在谷歌应用程序引擎中的角度项目中使用 firebase 身份验证对用户进行了身份验证。但是当我尝试显示与用户对象映射的 photourl 时，我收到 http 403 错误代码。

我是否需要应用程序级别的额外权限才能访问 photourl？

照片网址示例：https://scontent.xx.fbcdn.net/v/t1.0-1/s100x100/10354686_10150004552801856_220367501106153455_n.jpg ?oh=69aa0ab876bc8904fb59749a5e70382a&oe=598 D6773

我已经为项目安装和使用了很多次AngularFire2,但是自从v5发布以来,我无法正确设置它.

这些是我为解决问题而采取的步骤.

$ ionic start angularfire2test tabs
$ npm install angularfire2 firebase --save

的package.json

"angularfire2": "^5.0.0-rc.3",
"firebase": "^4.5.2",

将Firebase凭据添加到app.module.ts +导入默认模块和数据库模块.这是最重要的部分

import { AngularFireModule } from 'angularfire2';
import { AngularFireDatabaseModule } from 'angularfire2/database';
...
@NgModule({
  declarations: [
    MyApp,
    AboutPage,
    ContactPage,
    HomePage,
    TabsPage
  ],
  imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp),
    AngularFireModule.initializeApp(firebaseCredentials),
    AngularFireDatabaseModule
  ],
  bootstrap: [IonicApp],
  entryComponents: [
   ....

当我执行时$ ionic serve,我在webpackMissingModule(http:// localhost:8100/build/vendor.js:119190:82)收到错误消息"找不到模块"@ firebase/database"

检查node_modules文件夹时,@ firebase没有数据库子文件夹,但firebase-folder确实有一个数据库文件夹.

我做错了什么或是AngularFire2的一般问题？

我正在浏览Firestore文档和指南.我下面的代码示例使用AngularFire2.

让我们考虑类似于此处提供的示例的"聊天"集合:https://firebase.google.com/docs/firestore/manage-data/structure-data

他们推荐这种结构,但我不知道他们在哪里讨论有效地获取所有数据.

每个聊天文档都有属性,成员集合和消息集合:

• chatsCollection
  • chatDocument
    • [在这里插入聊天数据字段]
    • membersCollection
      • memberDocument
        • [在此处插入会员数据字段]
    • messagesCollection
      • messageDocument
        • [在此处插入消息数据字段]

Firestore查询很浅,有时可能很棒.我的理解是,没有编入方式来深入查询并获取嵌套集合.那么,最好的做法和最无忧无虑的方法是什么？

目前我正在检索快照并将快照映射到具有ID的对象,并将嵌套的集合数据添加到父文档数据中,并附加查询和映射,我对我的方法感到不满意,即使使用非规范化的Firebase也可以更快地完成结构.

这个代码示例只是在成员上映射,在消息中添加回来是另一个故事......

getChatsFromFirestore() {
    this.chats = this.dataSvc.getChatsFromFirestore().snapshotChanges()
      .map(chatSnaps => {
        return chatSnaps.map(chat => {
          const chatData = chat.payload.doc.data();
          const chatId = chat.payload.doc.id;
          return this.dataSvc.getMembersForChat(chatId)
            .snapshotChanges()
            .map(memberSnaps => {
              return memberSnaps.map(member => {
                const data = member.payload.doc.data();
                const id = member.payload.doc.id;
                return { id, ...data }
              });
            })
            .map(members => {
              return { chatId, ...chatData, members: members };
            });
        })
      })
      .flatMap(chats => Observable.combineLatest(chats)); …

我有一个像下面这样的异步方法.它[ts] 'await' expression is only allowed within an async function.在这里显示错误await userProfile.set({.你能告诉我怎么解决它吗？

注意:也许是因为我试图在promise里面打电话observable.任何线索？

 async loginWithGoogle(): Promise<void> {
    const result = await this.afAuth.auth.signInWithPopup(new firebase.auth.GoogleAuthProvider());
    const userId: string = result.uid;
    const userProfile: AngularFirestoreDocument<UserProfile> = this.fireStore.doc(`userProfile/${userId}`);
    const userProfiles: AngularFirestoreCollection<UserProfile> = this.fireStore.collection('userProfile/', ref => ref.where('email', '==', result.email));
    const userProfiles$: Observable<UserProfile[]> = userProfiles.valueChanges();
    userProfiles$.subscribe(res => {
      if (res == null) {
        await userProfile.set({ //here it shows error
          id: userId,
          email: result.email,
          creationTime: moment().format(),
          lastSignInTime: moment().format()
        });
      } …

我正在查询 firestore：

this.todosCollection = this.afs.collection('todos', ref => ref.where('owner', '==', this.userId). orderBy('due', 'asc'));

待办事项按我想要的升序排列，问题是没有截止日期（空）的待办事项排在第一位。我希望他们排在最后。这在 orderBy 或其他技术中可能吗？

我基本上是 Angularfire2 的新手，当用户按下删除按钮时，我试图从 Firebase 存储中删除一个文件夹。不幸的是，此类信息不在 Angularfire2文档中。

我基本上尝试使用下面的代码：

constructor(private afs: AngularFirestore, private storage: AngularFireStorage) { 
      this.clientsCollection = this.afs.collection('clients', ref => ref.orderBy('uid', 'asc'));;
  }

   deleteClient(client, callback){
    this.storage.ref(client.uid).delete();
  }

不幸的是，它抛出以下错误

FirebaseStorageError {code_: "storage/object-not-found", message_: "Firebase Storage: Object '3CqyNHrIwQ3sRlj83JKM' does not exist.", serverResponse_: "{?  "error": {?    "code": 404,?    "message": "Not Found.  Could not delete object"?  }?}", name_: "FirebaseError"}

我将每个客户的文档存储在一个文件夹中，该文件夹的名称与客户的uid相似。这实际上只是 Firebase 生成的 ID。当我尝试删除该文件夹时出现上述错误。请帮忙，我该怎么办？

我正在尝试为我的Angular 6应用添加firebase支持但是在添加angularfire2时

npm install angularfire2 firebase

我得到很多警告说我必须使用Angular 5.例如

npm WARN angularfire2@5.0.0-rc.6.0 requires a peer of @angular/core@^5.0.0 but none is installed. You must install peer dependencies yourself.

今天可以使用angularfire2和Angular 6吗？

编译时出现此错误:

ERROR in node_modules/angularfire2/angularfire2.d.ts(3,10): error TS2305: Module '"/home/rrr/Projects/ng6test/node_modules/rxjs/Subscription"' has no exported member 'Subscription'.
node_modules/angularfire2/firebase.app.module.d.ts(10,22): error TS2720: Class 'FirebaseApp' incorrectly implements class 'FirebaseApp'. Did you mean to extend 'FirebaseApp' and inherit its members as a subclass?
  Property 'automaticDataCollectionEnabled' is missing in type 'FirebaseApp'.
node_modules/rxjs/Subscription.d.ts(1,15): error TS2307: Cannot find module 'rxjs-compat/Subscription'.

我试图安装rxjs-compat,但之后又收到了警告

ERROR in …

描述

我在使用 firestore 处理删除时遇到问题。简而言之，我为这样的帖子创建了一个安全规则：

首先在规则中有一些功能：

服务 cloud.firestore {

function userRoles() {
    return ['admin', 'customer', 'reader'];
}

function userGenders() {
    return ['mal', 'female', 'other'];
}

function postVisibilities() {
    return ['public', 'private', 'protected'];
}

function postType() {
    return ['music', 'motion_design', 'graphic_art'];
}

function isPayment(paymentDoc) {
    return paymentDoc != null
        && paymentDoc.date is timestamp
        && paymentDoc.price is number
        && paymentDoc.price is number
        && paymentDoc.price > 0;
}

function isBill(billDoc) {
    return billDoc.sellerId is string
        && billDoc.buyerId is string
        && billDoc.postIds != null
        && …

我想在“真正”启动单页应用程序之前，在 firebase 身份验证检索用户令牌时显示一个小的加载徽标。

到目前为止我有一个身份验证服务：

constructor(
    public afAuth: AngularFireAuth,
    ) {
      this.afAuth.onAuthStateChanged(user => {
        if (user) {
           this.setCredentials(user)
        }
      })
    }

  setCredentials(user: firebase.User) {
      return user.getIdTokenResult(true).then(idTokenResult => {
        this.credentials = {
          userId: idTokenResult.claims.id,
          role: idTokenResult.claims.role,
          token: idTokenResult.token,
        };
        // STARTS THE APPLICATION NOW ?
      })
  }

有可能实现这样的行为吗？我读过有关 APP_INITIALIZER 的内容但没有成功。我想避免本地存储/会话存储，而是仅依赖于此初始化。

更新：

创建了一个初始化函数：

export function initApp(auth: AuthService, afAuth: AngularFireAuth) {
    return () => {
      return new Promise((resolve) => {
        afAuth.user.pipe(
            take(1),
        ).subscribe(user => {
          if (user) {
            auth.setCredentials(user)
            .then(() => resolve())
          } …