Observando as mudanças do modelo no Polymer Dart

As expressões de polímero podem ser complicadas quando associadas às propriedades do modelo. Os documentos sobre Observables ainda não estão lá, e há muitas informações desatualizadas circulando nas interwebs.

Eu estava tentando alterar o texto em um botão com base no fato de o campo id de um modelo ser nulo ou não.

<button on-click="{{save}}" type="button">
<template if="{{exists}}">Edit</template>
<template if="{{!exists}}">Add</template>
</button>

Eu inicialmente tinha o seguinte:

@observable
bool exists => !(id==null);

O fato é que nenhum evento de alteração foi disparado quando as propriedades do modelo foram atualizadas. Acontece que a solução é vincular a uma variável fictícia e atualizá-la rastreando as alterações nas propriedades do modelo:

import 'package:polymer/polymer.dart';
import 'dart:mirrors';
import 'mymodel.dart';

@CustomTag(‘my-model-form’)
class MyModelForm extends PolymerElement {

  @observable MyModel model = new MyModel();
  @observable bool exists = false;  

  MyForm.created() : super.created();

  @override
  void attached() {
    model.changes.listen(_trackChanges);
    super.attached();
  }

  _trackChanges(changes) {
    changes.forEach((PropertyChangeRecord record) {
      if(MirrorSystem.getName(record.name)=='id')
        exists = !(record.newValue==null);        
    });
  }
}

Um PropertyChangeRecord retorna uma Lista de símbolos, então eu precisava da biblioteca Mirror para extrair o nome do campo real.