1

Once again, a Dart/Polymer related question.

I wanted to use the Parse.com JavaScript library, but since it's not available in Dart I've written Wrapper classes which store a JsObject and delegate all calls from Dart to the corresponding JavaScript object. Basically it's like a proxy.

Guess what, it works pretty great.

However, my observables don't. To understand this, you have to take a look at the following structure of one of my "proxy"-classes.

class ParseObject extends Observable {

   JsObject _jsDelegate = new JsObject(context['Parse']['ParseObject']);

   void set(String key, dynamic value) {
      _jsDelegate.callMethod('set', [key, jsify(value)];
   }

   dynamic get(String key) {
      return dartify(_jsDelegate.callMethod('get', [key]));
   }

}

The HTML code of my Polymer Element looks like this:

<div>Name: {{project.get('name')}}</div>

Since the data binding is only evaluate in case the parameter of the method changed, it will never be updated and thus even though the name is changed, the old one will stay in place.

The solution I came up with is to store all the values the user is setting in the ParseObject#set(String, dynamic) method into a Map which is observable. This works but I think it's quiete dirty since I have to make sure that both Maps, the one in Dart and the one in the ParseObject's JavaScript representation equal.

Thus I am looking for a better solution and I think of some kind of method to tell Polymer to reevaluate it's data bindings.

Does such a method exist or are there any other possibilities to address this problem?

Basic Coder
  • 10,882
  • 6
  • 42
  • 75

1 Answers1

2

Extending observable by itself does nothing yet. You need to annotate the getters with @observable (and if you are not using Polymer, you also need to add the observable transformer to pubspec.yaml). You can't make functions observable (this works in Polymer elements but not in Observable model classes. For more details about observable see for example Implement an Observer pattern in Dart or Dart: @observable of getters

Community
  • 1
  • 1
Günter Zöchbauer
  • 623,577
  • 216
  • 2,003
  • 1,567
  • I am using Polymer but my ParseObject is not a PolymerElement. Adding @observable to the getter didn't change anything. I came up with a pretty different solution which works. I extend ObservableMap and override the operator [ ] to call the get method of my ParseObject. Whenever set(String, dynamic) of my ParseObject is called I issue a change by calling notifyPropertyChange on the property which uses the extended Map. Still not the best solution but I kind of feel happy with it. Thanks for answering tho, you literally answer ALL my questions in less than 20 minutes. – Basic Coder Apr 17 '15 at 15:40
  • I try :-). Your `get` is a function not a getter, this is why `@observable` doesn't work. you could probably do the same with the class (call `notifyPropertyChange`)` but you would need to change your code to have a getter instead of a function. Maybe it would work to include an `@observable` field and use it in the argument list of the function and call `notifyPropertyChange` for that field. – Günter Zöchbauer Apr 17 '15 at 15:46
  • 1
    Yep, adding `@observable` in front of my `get(String)` method and calling `notifyPropertyChange(#get, ...)` works. Thus I get rid of this hacky Map I extended. Thanks a lot! – Basic Coder Apr 17 '15 at 15:51