Question

我一直在关注Dart web-ui codelab。当我在网络组件.html文件中嵌入dart源代码时，我没有在Dart编辑器中获得任何静态分析或自动完成支持（这是http://code.google.com/p/dart/issues/detail?id=7449的一个开放式错误）。因此，我正在寻找使用src属性的临时解决方法。

根据规范，Dart中的Web组件支持src属性： https://www.dartlang.org/articles/dart-web-components/spec.html#behavior。我尝试链接到外部Dart库：为

提供foo.html Web组件

<element name="x-foo-component" constructor="FooComponent" extends="div">

我想通过添加以下内容链接到与我的Web组件相同的目录中的单独foo_embed.dart文件，该组件定义FooComponent：

<script type="application/dart" src="foo_embed.dart"></script>

在foo.html内

。根据规范的建议，foo_embed.dart需要是Dart库，并且包含：

library foo_embed;
import 'package:web_ui/web_ui.dart';
class FooComponent extends WebComponent {
    ...
}

当我尝试此操作时，运行build.dart（来自这些说明http://www.dartlang.org/articles/dart-web-components/tools.html）最终只会将foo_embed.dart放入out/并且没有生成out/foo.html.dart用于导入在application.dart。

正如预期的那样，将foo_embed.dart的内容直接粘贴到foo.html内的内联脚本（如在codelab中一样）与build.dart一起使用，我可以在Dartium中启动我的webapp，所以我的项目中似乎没有任何其他语法问题。

我可能在某处有一个简单的语法错误吗？或者这是Dart Web组件编译器的临时限制？感谢。

Answer 1

我无法重现你的问题。

这对我有用：

<强> LIB / foo.dart

library foo;

import 'package:web_ui/web_ui.dart';

class FooComponent extends WebComponent {
  var foo = 'asddfg';
}

<强> LIB / foo.html

<element name="x-foo" constructor="FooComponent" extends="div">
  <template>
    <input value="{{ foo }}" />
  </template>
  <script type="application/dart" src="foo.dart"></script>
</element>

示例/的test.html

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <link rel="components" href="packages/foo/foo.html" /> </head> <body> <x-foo></x-foo> <script type="application/dart">main() {}</script> <script type="text/javascript" src="https://dart.googlecode.com/svn/branches/bleeding_edge/dart/client/dart.js"></script> </body> </html>

然后我打开Dartium并转到.../example/out/test.html，我看到输入正确绑定了数据。

如何链接到包含Web组件构造函数的外部Dart库？

1 个答案: