Angular5+Angularfire2查询Firebase实时数据库无结果求助

问题描述 #

我正在使用Angular 5查询Firebase实时数据库，尝试过新API但查询毫无进展——查询能执行却无结果返回。我的数据集结构简单，能够正常列出所有数据，但按字段过滤查询时，控制台能触发两条日志事件，却返回空数据。

环境版本 #

"@angular/cli": "1.6.3",
"@angular/compiler-cli": "^5.0.0",
"@angular/language-service": "^5.0.0",
"angularfire2": "^5.0.0-rc.4",
"firebase": "4.8.0"

相关代码 #

find(abn: string) {
  this.db.list<company>('/company', ref => ref.orderByChild('abn').equalTo(abn)).snapshotChanges().map(actions => {
    console.log(`Action: ${actions}`);
    return actions.map(action => ({ key: action.key, value: action.payload.val()}));
  }).subscribe(items => {
    this.query = items.map(item => ({key: item.key, value: item.value}));
    console.log(`Query Results: ${this.query}`);
  });
}

解决思路 #

• 检查Firebase数据库安全规则：首先确认你的数据库规则允许读取/company节点的数据。如果规则限制了未认证用户的读取权限，而当前用户没有完成认证，查询就会返回空数据。测试阶段可以暂时开放规则（上线前务必改回安全配置）：

  {
    "rules": {
      ".read": true,
      ".write": true
    }
  }
  

• 验证字段值的精确匹配：确保数据库中/company下的子节点确实存在abn字段，且字段值和你传入的abn参数完全一致——注意大小写、空格、数据类型（比如字符串和数字的差异），这些细节很容易导致匹配失败。

• 调试原始快照数据：可以添加RxJS的do（RxJS 5.x）操作符，直接查看Firebase返回的原始快照，确认是否真的没有数据返回：

  import 'rxjs/add/operator/do';
  
  find(abn: string) {
    this.db.list<company>('/company', ref => ref.orderByChild('abn').equalTo(abn))
      .snapshotChanges()
      .do(rawActions => console.log('原始返回数据:', rawActions))
      .map(actions => {
        return actions.map(action => ({ key: action.key, value: action.payload.val()}));
      })
      .subscribe(items => {
        this.query = items;
        console.log('处理后结果:', this.query);
      });
  }
  

  这样能帮你区分是Firebase没返回数据，还是后续的转换逻辑出了问题。

• 确认字段索引配置：如果你的数据集较大，Firebase需要为abn字段创建索引才能高效执行orderByChild查询。你可以查看Firebase控制台的日志，是否有提示需要创建索引的信息，按照提示添加索引即可（一般会直接给出可复制的规则代码）。

• 检查RxJS操作符的导入：Angular 5使用的是RxJS 5.x，map等操作符需要手动导入，否则可能不会生效。确保你在代码顶部导入了：

  import 'rxjs/add/operator/map';
  

内容的提问来源于stack exchange，提问作者user3812492