Bind button to visibleable in Polymer

Использование полимера в дротике Я хочу наблюдать за значением и привязывать кнопку к функции, которая ее меняет. В следующем примере кода (test.dart) следует уточнить, что я пытаюсь сделатьBind button to visibleable in Polymer

import 'dart:html'; 
import 'package:polymer/polymer.dart'; 
import 'package:observe/observe.dart'; 
import 'package:mdv/mdv.dart' as mdv; 

class App extends Object with ObservableMixin { 
    int _counter = 0; 

    int get counter => _counter; 
    void set counter(int c) { 
    print("counter set to $c"); 
    int oldValue = _counter; 
    _counter = notifyPropertyChange(const Symbol('counter'), _counter, c); 
    } 

    increment(var event) { 
    print("increment"); 
    counter = counter + 1; 
    } 
} 

main() { 
    mdv.initialize(); 

    var app = new App(); 
    query("#tmpl1").model = app; 
}

Используется с этим HTML

<!DOCTYPE html> 
<html> 
    <head> 
    <title>Test</title> 
    </head> 
    <body> 
     <template id="tmpl1" bind> 
     <button on-click="increment">{{counter}}</button> 
     </template> 
    <script type="application/dart" src="test.dart"></script> 
    <script src="packages/browser/dart.js"></script> 
    </body> 
</html>

Я бы ожидать, когда кнопка нажата, что приращение внутри Вызывается приложение, но ничего не происходит. Я уверен, что я пропускаю что-то простое, так как это должно быть возможно.

Примечание запустить пример кода выше вам не нужно, чтобы создать build.dart файл как не используются никакие таможенные-элементы.

источник

2013-07-30 Lars Tackmann

Похоже, что последний SDK (0.6.13.0_r25630) сломал что-то, примеры из dart-polymer-dart-примеров перестали работать с этим обновлением. – Lesiak

Оказывается, что я пытался достичь можно. Для того, чтобы получить его работу вам необходимо включить следующие данные в HTML

<script src="packages/polymer/boot.js"></script>

затем следующие работы

<polymer-element name="x-app"> 
    <template> 
     <button on-click="increment">{{counter}}</button> 
    </template> 
    <script type="application/dart"> 
     import 'package:polymer/polymer.dart'; 

     @CustomTag('x-app') 
     class XApp extends PolymerElement with ObservableMixin { 
     @observable int counter = 0; 

     increment(event, detail, target) { 
      print("increment"); 
      counter++; 
      Observable.dirtyCheck(); 
     }  
     } 
    </script> 
    </polymer-element> 

    <x-app></x-app>

И лучше всего это работает без необходимости стадии сборки (т.е. не более сборки .dart).

источник

2013-08-01 19:41:10

Я только что прочитал пример полимера target10, и я не уверен, что вы ищете решение, которое я собираюсь опубликовать.

получить Target 10: полимерный пример из https://github.com/dart-lang/dart-tutorials-samples/tree/master/web
Вставка <button on-click="increment">{{counter}}</button> где-нибудь в один из дивы в xslambookform.html
Вставка в любом месте в xslambookform.dart

int _counter=0; 
    int get counter => _counter; 

    void set counter(int c) { 
    print("counter set to $c"); 
    int oldValue = _counter; 
    _counter = notifyPropertyChange(const Symbol('counter'), _counter, c); 
    } 

    void increment(var e, var detail, Element target) { 
    print("increment"); 
    counter = counter + 1; 
    }

Запустите slambook.html и нажмите кнопку. Смотрите в консоли:

приращение

счетчик установлен на 1

приращение

счетчик устанавливается на 2

источник

2013-07-30 15:16:26 Gero

Спасибо за ответ, однако этот пример швов зависит от build.dart. Что-то, что мой пример не использует. Я был под их впечатлениями, что внешние сборки там, где только нужно, если вы создаете пользовательские элементы. –

ответ

Смежные вопросы