聚合物飞镖问题答案

【问题标题】：dart problems with polymer聚合物飞镖问题
【发布时间】：2014-06-28 10:45:16
【问题描述】：

我正在尝试在 dart 和 Polymer 中创建应用程序。我有这个代码：

app.html

<!DOCTYPE html>

<html>
  <head>
    <meta charset="utf-8">
    <title>Test</title>
    <link rel="stylesheet" href="css/login.css">
    <link rel="import" href="vistas/loginUI.html">

    <script src="packages/browser/dart.js"></script>
  </head>
  <body>
    <h1>Prueba</h1>
    <login-usuario></login-usuario>
      <script type="application/dart"> export 'package:polymer/init.dart';</script>
  </body>
</html>

loginUI.html：

<polymer-element name="login-usuario">
<meta charset="utf-8">
<template>
 <link rel="stylesheet" href="../css/login.css">
  <div id="login">
  <h1><strong>Bienvenido</strong></h1>

  <fieldset>
  <p><input type="text" required id="usuario" name="usuario"
      placeholder="Usuario"></p>
  <p><input type="password" required id="password" name="password"
      placeholder="Contraseña"></p>
  <p><button>ENTRAR</button></p>
  </fieldset>
  </div>
  <p>Hi</p>
</template>
<script type="application/dart" src="loginUI.dart"></script>

</polymer-element>

loginUI.dart

import 'package:polymer/polymer.dart';

@CustomTag('login-usuario')
class LoginUI extends PolymerElement{
  @observable String usuario;
  @observable String password;
  @observable bool errorConectar;

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

但是当我运行应用程序时，我无法显示任何内容。此外，当我创建一个新的聚合物项目（示例）时，我运行应用程序时也无法显示任何内容。我添加了聚合物依赖。

非常感谢！

【问题讨论】：

您好，您使用的是哪个版本的 Polymer？看起来你的设置不正确。您缺少：@initMethod for main 和
您在 loginUI.html 中缺少
如果我添加该行应用程序仍然无法正常工作
你把它放在哪里了？

标签： dart dart-polymer

【解决方案1】：

<!DOCTYPE html>

<html>
  <head>
    <meta charset="utf-8">
    <title>Test</title>
    <link rel="stylesheet" href="css/login.css">

    <!-- <script src="packages/web_components/platform.js"></script>
         not necessary anymore with Polymer >= 0.14.0 -->
    <script src="packages/web_components/dart_support.js"></script>

    <link rel="import" href="vistas/loginUI.html">

    <!--<script src="packages/browser/dart.js"></script>-->
  </head>
  <body>
    <h1>Prueba</h1>
    <login-usuario></login-usuario>

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

<!-- how many ../ you need depends on where your element files are stored -->
<link rel="import" href="../../packages/polymer/polymer.html"> 

<polymer-element name="login-usuario">
  <meta charset="utf-8">
  <template>
   <link rel="stylesheet" href="../css/login.css">
    <div id="login">
    <h1><strong>Bienvenido</strong></h1>

    <fieldset>
    <p><input type="text" required id="usuario" name="usuario"
        placeholder="Usuario"></p>
    <p><input type="password" required id="password" name="password"
        placeholder="Contraseña"></p>
    <p><button>ENTRAR</button></p>
    </fieldset>
    </div>
    <p>Hi</p>
  </template>
  <script type="application/dart" src="loginUI.dart"></script>

</polymer-element>

你的 pubspec.yaml 应该包含

transformers:
- polymer:
    entry_points:
    - web/app.html

【讨论】：

当我从修改中执行这些操作时，dart 给我一个例外：打破异常：ReferenceError: Platform is not defined and reference to polymer.js : d.prototype={valueFn:function(){if （！这个........
我使用上面的代码创建了一个新项目，它运行良好（当我还添加 css 或删除 css 链接时，请参阅code.google.com/p/dart/issues/detail?id=19719）您使用的是哪个 Dart 版本？
我正在使用 Dart Editor 版本 1.4.0.release (STABLE)。如果我运行此代码，它不起作用
我正在使用 Dart 1.6 前沿。我认为您应该尝试 1.5（几天后应该可以使用稳定版）。
我将飞镖更新到 1.5。现在，当我运行应用程序时，dart 给我这个错误：“无法创建服务器套接字（操作系统错误：试图以访问权限禁止的方式访问套接字。，errno = 10013），地址 = 127.0 .0.1，端口 = 8080"