CODEWITHSUNDEEP
dartdart-polymer
Muka
Muka

Reputation: 1200

Dart Polymer 1.0 - Two-way binding works?

Two-way binding works in Dart Polymer 1.0 - RC2?

When I change the field @Property(nofity: true) in the .dart, it does not reflect (change) into {{}} in the .html.

See the following example.

Whem I click on paper-button, it´s fire clicar, the property text is changed, but {{text}} does not change!

main_app.html

<dom-module id="main-app">
  <style>
    :host {
      display: block;
    }
  </style>

  <template>
    <paper-input label="Type something..." value="{{text}}"></paper-input>
    <p>
      Text: <span>{{text}}</span><br />
    </p>
    <paper-button on-click="clicar">cliqueme</paper-button>
    </p>
  </template>
</dom-module>

main_app.dart

@HtmlImport('main_app.html')
library untitled8.lib.main_app;

import 'dart:html';

import 'package:polymer_elements/paper_button.dart';
import 'package:polymer_elements/paper_input.dart';
import 'package:polymer/polymer.dart';
import 'package:web_components/web_components.dart';

@PolymerRegister('main-app')
class MainApp extends PolymerElement {
  @Property(notify: true)
  String text;

  MainApp.created() : super.created();

  @reflectable
  void clicar(e, detail) {
    text = "super teste";
  }
}

Upvotes: 2

Views: 286

Answers (1)

G&#252;nter Z&#246;chbauer
G&#252;nter Z&#246;chbauer

Reputation: 658067

You need to use the provided methods to updated properties like

 set('text', "super teste");

notify: true is only to notify parent elements (fires an test-changed event)

There are quite a lot such methods in PolymerBase mixin which you get automatically added by extending PolymerElement and which notify Polymer about changes.

  • notifyPath (currently the same as set)

for collections there are

  • add
  • addAll
  • clear
  • fillRange
  • insert
  • insertAll
  • removeItem
  • removeAt
  • removeLast
  • removeRange
  • removeWhere
  • replaceRange
  • retainWhere
  • setAll
  • setRange

there is also a

  • get

not sure about what to use it for.

Upvotes: 3

Related Questions