Question

我喜欢在main-html中使用名为content-page的自定义Polymer Element。因此，我使用div创建了id="contentcontainer"，其中包含content-page。出于某种原因它崩溃了，只需点击Run并且Dart编辑器说：。当我删除main.html中的行<link rel="import" href="content-page.html">时，程序没有崩溃，但是我的main（）的内容似乎有问题。

我遗憾地没有具体问题，因为我不知道错误可能在哪里或从哪里开始。有人在我的代码中看到了一些可疑部分吗？谢谢你的帮助！

main.dart：

import 'dart:html';

void main() {
  var newElement = new Element.tag('content-page');

  querySelector('#contentcontainer').children.add(newElement);
}

main.html中：

<!DOCTYPE html>

<head>
    <meta charset="utf-8" />
    <link rel="stylesheet" type="text/css" href="style.css">
    <script type="application/dart" src="main.dart"></script>
    <script src="packages/web_components/dart_support.js"></script>
    <link rel="import" href="content-page.html">
</head>

<body>
  <div id="contentcontainer">
    <content-page id="contentpage"></content-page>
  </div>
  <script type="application/dart">export 'package:polymer/init.dart';</script>
</body>
</html>

内容page.dart：

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

@CustomTag('content-page')
class ContentPage extends PolymerElement {

  ContentPage.created() : super.created();
}

内容page.html中：

<link rel="import" href="../packages/polymer/polymer.html">
<polymer-element name="content-page" >

  <template>
    <div>
      ContentPage-Content
    </div>
  </template>

  <script type="application/dart" src="content-page.dart"></script>

</polymer-element>

Answer 1

我尝试了你的代码，没关系。你有没有将变形金刚添加到pubspec.yaml？

name: sample
description: A sample web application
dependencies:
  browser: any
  polymer: any
transformers:
- polymer

Answer 2

您应该看一下这个问题/答案：how to implement a main function in polymer apps如何在Polymer项目中使用自定义主方法。
此行应包含包含main方法的文件（另请参阅链接问题中的答案）：

<script type="application/dart">export 'package:polymer/init.dart';</script>

此行是多余的

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

如果您不使用最新的Polymer版本，变压器配置还需要一个入口页面列表

变压器：

- polymer:
    entry_points:
    - web/index.html

添加聚合物元素会导致崩溃

2 个答案: