【问题标题】:Syncing Typescript types to Firebase Object Observables without losing functions etc将 Typescript 类型同步到 Firebase Object Observables 而不会丢失功能等
【发布时间】:2017-06-02 08:41:50
【问题描述】:

我正在使用 Typescript 开发 Angular 2 应用程序,但我经常遇到问题,即在同步数据时我似乎无法很容易地持久化对象类型。

我一直在手动设置属性。在某些情况下,我只是删除了 $exists()、$key、c​​reateat 函数和属性,以便能够更新数据。

有没有办法在不完全改变 Firebase 对象的情况下设置一个类?

举个例子:

search$:FirebaseObjectObservable<ISearchQuery>;
search:ISearchQuery;

constructor(public af: AngularFire, public auth: AuthService){
  this.search$ = this.af.database.object(`/queries/saved/${auth.id}`);
  //THIS IS HOW I WANT TO DO IT
  this.search$.subscribe((data)=>{
    if(data.$exists()){
       this.search=data;           
    }
  });  

  //THIS IS WHAT I'VE RESORTED TO
  this.search$.subscribe((data)=>{
    if(data.$exists()){
      this.search.categories = data.categories;
      this.search.creators = data.creators;
      this.search.endDate = data.endDate;
      this.search.startDate = data.startDate;
      this.search.location = data.location;
     }
  });  
}

另一方面,当我同步和更新数据时,我必须在更新或设置为 firebase 时选择每个属性。如果我直接同步我也会遇到问题,我也会丢失类函数(因为 firebase 对象在原型中有自己的一组函数)。

有没有办法避免按属性选择属性,或者有更好的方法来处理将 Firebase 对象与 Typescript 同步?

【问题讨论】:

    标签: angular typescript firebase firebase-realtime-database angularfire2


    【解决方案1】:

    听起来您希望 AngularFire2 保留 Firebase 快照。默认是'unwraps' the snapshots,加上$-prefixed你不想要的属性和函数。

    如果你指定preserveSnapshot选项,它不会这样做,你可以调用snapshot.val()

    constructor(public af: AngularFire, public auth: AuthService) {
    
      this.search$ = this.af.database.object(`/queries/saved/${auth.id}`, {
        preserveSnapshot: true
      });
      this.search$.subscribe((snapshot) => {
        if(snapshot.exists()) {
           this.search = snapshot.val();
        }
      });
    }
    

    如果您以后需要它,您可以随时保留快照。

    关于ISearchQuery——我假设它是一个接口——你从snapshot.val()收到的值是一个匿名对象。将其转换为描述数据“形状”的接口是安全的,但如果该接口包含方法,则它将无法工作,因为匿名对象上不存在这些方法。如果您有一个实现该接口的类,您应该包含一个构造函数,该构造函数接受您从snapshot.val() 收到的匿名对象。

    例如:

    this.search$.subscribe((snapshot) => {
      if(snapshot.exists()) {
        // Given SomeSearchQuery implements ISearchQuery
         this.search = new SomeSearchQuery(snapshot.val());
      }
    });
    

    【讨论】:

    • 太好了,就重新同步数据而不必去除功能等而言,这似乎是答案的一半......但是,看起来我仍然失去了功能当我以这种我想保留的方式实例化一个类时,我的 ISearchQuery 类型。有没有办法做到这一点?
    • 更新了答案。
    • 这让我省了很多麻烦。我能够直接同步对象而无需删除 $exists、$key 等...这对于使用构造函数传递匿名对象是有意义的。谢谢一百万!
    猜你喜欢
    • 2020-10-03
    • 2013-05-12
    • 2023-01-20
    • 2011-04-06
    • 2021-07-23
    • 1970-01-01
    • 1970-01-01
    • 2020-06-13
    • 1970-01-01
    相关资源
    最近更新 更多