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

标签 dart dart-webui

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

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

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

我想链接到一个单独的 foo_embed.dart与我的 Web 组件位于同一目录中的文件,它定义了 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.dartout/并且没有 out/foo.html.dart为导入而生成 application.dart .

正如所料,粘贴foo_embed.dart的内容作为 foo.html 中的内联脚本直接(在代码实验室中完成)与 build.dart 一起使用,并且我可以在 Dartium 中启动我的 webapp,所以我的项目中似乎没有任何其他语法问题。

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

最佳答案

我无法重现您的问题。

这对我有用:

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我看到一个数据正确绑定(bind)到它的输入。

关于dart - 如何链接到包含 Web 组件构造函数的外部 Dart 库?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13922062/

相关文章:

android - 如何在 Flutter 中格式化日期时间

flutter - flutter 重启应用程序或重定向到第一个小部件

Dart:如何修复条件?

javascript - 我们用 Dart 来编写 Angulardart 代码吗?

dart - 在 Dart 中动态添加 WebComponent?

dart - Angular 组件的应用程序布局使用 .scss 引发错误

flutter - 在Flutter,Dart中找到确切的单词

flutter - 如何在 flutter block 模式中重用以前的状态字段?

dart - 如何将任意数据从Dart polymer Web组件传递到Click事件处理函数

dart - 当 Dart 项目移动到服务器时按钮不起作用