auto-binding-dart 不工作,失败并出现 Bad State Error
auto-binding-dart is not working, fails with Bad State Error
我正在尝试 运行 这个自动绑定飞镖的基本示例 auto binding dart source。但它失败了
Breaking on exception: Bad state: Template must be cleared before a
new bindingDelegate can be assigned
我正在使用 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!');
}
您不需要在另一个模板中使用 <template is="auto-binding-dart">
。
auto-binding-dart 的要点是在 Polymer 元素之外有一个 mustache 绑定上下文。您可以使用 auto-binding-dart 而不是 您的主应用程序 不在 .
比起 auto-binding-dart,我更喜欢 app-element(或像你命名的 main-app),因为这样你不需要 main 方法。
<polymer-element ...>
中最外层的 <template>
标签自动使用元素 class 作为模型(绑定上下文)。
我正在尝试 运行 这个自动绑定飞镖的基本示例 auto binding dart source。但它失败了
Breaking on exception: Bad state: Template must be cleared before a new bindingDelegate can be assigned
我正在使用 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!');
}
您不需要在另一个模板中使用 <template is="auto-binding-dart">
。
auto-binding-dart 的要点是在 Polymer 元素之外有一个 mustache 绑定上下文。您可以使用 auto-binding-dart 而不是 您的主应用程序 不在 .
比起 auto-binding-dart,我更喜欢 app-element(或像你命名的 main-app),因为这样你不需要 main 方法。
<polymer-element ...>
中最外层的 <template>
标签自动使用元素 class 作为模型(绑定上下文)。