Question

我正在尝试使用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();
}

但是当我运行应用程序时，我无法显示任何内容。此外，当我创建一个新的聚合物proyect（示例）时，我运行应用程序时都不能显示任何内容。我加入了聚合物依赖性。

非常感谢你！

Answer 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

聚合物的飞镖问题

1 个答案: