Search code examples
firebaseractivejs

Three way data binding with RactiveJS and Firebase

I'm really wondering if there is anybody that took a shot at Firebase via RactiveJS.

What I'm confused about is that Ractive uses array modifier events to trigger some DOM changes.

So far so good, ractive.unshift('arr',1) would mean updating the following:

{{ # arr }} 
     {{ . }} 
{{ / }}

But.. since Firebase uses Objects instead Arrays how can I pull out a three-way data binding with Ractive ? I really enjoy the ease of use RactiveJS offers and I wouldn't like moving away just because of this.

Any ideas ?

Thank you very much !

Solution

  • There isn't a lot in your question, but I believe you're trying to set data. ractive.set should be everything you need for that:

    ractive.set('some.object.keypath', obj);

    There's nothing fancy about this (there are a few under-the-hood things that happen though). This is synonymous to doing:

    some.object.keypath = obj;

    Also, should you want to abstract the fact that you're using Firebase, you could create an adaptor. It's essentially just an abstraction layer, translating to and from a third-party data source. A common example is adapting Backbone models to Ractive.