auto-binding-dart无效,失败,出现错误状态错误

时间:2015-02-06 20:35:52

标签: dart dart-polymer

我正在尝试运行auto-binding-dart auto binding dart source这个基本示例。但它失败了

  

中断异常:错误状态:模板必须在a之前清除   可以分配新的bindingDelegate

我使用stagehand polymerapp模板这样做。 的index.html

<html>
<head>
  <link rel="import" href="../lib/main_app.html">
  <link rel="stylesheet" href="styles.css">
   <script type="application/dart">export 'package:polymer/init.dart';</script>
</head>

<body unresolved>
  <main-app></main-app>
</body>
</html>

main_app.html

<link rel="import" href="../../packages/polymer/polymer.html">
<polymer-element name="main-app">
  <template id="my-template" is="auto-binding-dart">
    <style>
      :host {
        display: block;
      }
    </style>
      <div>Say something: <input value="{{value}}"></div>
      <div>You said: {{value}}</div>
      <button on-tap="{{buttonTap}}">Tap me!</button>
  </template>
  <script type="application/dart" src="main_app.dart"></script>
</polymer-element>

main_app.dart

import 'dart:html';
import 'package:polymer/polymer.dart';
@CustomTag('main-app')
class MainApp extends PolymerElement {
  /// Constructor used to create instance of MainApp.
  MainApp.created() : super.created();
  ready(){
    super.ready();
    var template = document.querySelector('#my-template');
    template.model = new MyModel(); 
  }  
}
class MyModel {
  String value = 'something';
  buttonTap() => window.console.info('tap!');
}

1 个答案:

答案 0 :(得分:1)

您不需要在另一个模板中使用<template is="auto-binding-dart">

auto-binding-dart的目的是为Polymer元素外部的胡子绑定提供上下文。你可以使用auto-binding-dart 而不是你的主应用而不是

我更喜欢app-element(或者像你命名的主应用程序)而不是自动绑定dart,因为你不需要这样的主方法。

<template>中最外面的<polymer-element ...>标记会自动将元素类用作模型(绑定上下文)。