1

我正在创建我的第一个聚合物应用程序/示例,但一个简单button on-click的方法不起作用。该方法未被调用。我想使用一个简单的按钮而不创建新的聚合物元素(注释代码)。如果我使用聚合物元素中的按钮,它们就可以正常工作。

<!DOCTYPE html>

<html>
  <head>
    <meta charset="utf-8">
    <title>Button</title>
    <link rel="stylesheet" href="button.css">
     <script src="packages/polymer/boot.js"></script>
  </head>
  <body>
    <h1>Button</h1>

   <template id="tmpl" bind>
     <button  on-click="myMethod">Click me!</button><!! DOES NOT WORK!!! -->
     </template> 
     <!--
   <polymer-element name="my-element" extends="div">
      <template>
        <p>
          <button on-click="myMethod">Show Message</button>
          <button on-click="myMethod">Hide Message</button>
        </p>
      </template>   
    </polymer-element>

    <my-element id="test"></my-element>-->

    <script type="application/dart" src="button.dart"></script>       
  </body>
</html>

.

import 'dart:html';
import 'package:polymer/polymer.dart';

void main() {
  query("#tmpl").model = new MyClass();
}

@CustomTag('my-element')
class MyClass extends PolymerElement with ObservableMixin{

  @observable String name="testname";

  void myMethod(var e, var detail, var target) {
    print("button works");
  }
}

编辑:我刚刚意识到myMethod我的按钮从聚合物元素中调用无法访问模板中定义的其他元素(例如单选按钮或复选框)的数据tmpl

4

2 回答 2

0

是的,这些on-*属性只能在 Polymer 元素中起作用。

于 2013-09-01T19:05:21.657 回答
0

您可以创建自定义元素 dart-button 并使用自定义属性来设置 onclick 方法。 正如我在这个演示中使用它进行 onblur

您可以在应该合作的控件之间共享一个模型,并在该模型中保持控件状态。然后您可以访问其他控件状态。

于 2013-09-24T05:34:10.730 回答