我使用Dart Polymer创建Web组件。为了调试CSS样式,我在Dartium中启动了该应用,然后使用Chrome DevTools检查了样式。
问题在于,尽管正确应用了<style>
标签中定义的所有样式,<polymer-element>
它们都不会出现在DevTools中!在哪里可以找到那些样式?
我对Polymer(和Dart)很新,我怀疑我在这里遗漏了一些明显的东西.在我的应用程序中,我有代码迭代对象列表,并在UL中将项目呈现为LI元素.列表未正确呈现.
在简化了我的内容之后,这里是我的自定义元素的Dart代码:
import 'package:polymer/polymer.dart';
@CustomTag('users-element')
class UsersElement extends PolymerElement {
@observable List users = toObservable(['Mike', 'Anne', 'Kim']);
UsersElement.created() : super.created() {}
}
Run Code Online (Sandbox Code Playgroud)
这是相关的HTML代码:
<polymer-element name="users-element">
<template>
<ul>
<li repeat="{{user in users}}">
{{user}}
</li>
</ul>
</template>
<script type="application/dart" src="users_element.dart"></script>
</polymer-element>
Run Code Online (Sandbox Code Playgroud) 以下聚合物元素具有on-keypress事件侦听器:
<polymer-element name="custom-element">
<template>
<input type="text" on-keypress="{{print}}" value="{{text}}">
</template>
<script type="application/dart" src="custom.dart"></script>
</polymer-element>
Run Code Online (Sandbox Code Playgroud)
我希望元素能够监听特定的按键类型(例如,输入,退格等).这可能吗?
我正在使用Dart SDK 1.5.3 | 聚合物0.11.0 + 5 | Windows x64.当我使用模板'使用聚合物库(移动友好)选项的示例Web应用程序'创建创建的聚合物应用程序并运行应用程序时,它按预期工作,当单击按钮时计数器递增.
假设页面有
<script type="application/dart">
export 'package:polymer/init.dart';
</script>
Run Code Online (Sandbox Code Playgroud)
是index.html,试图通过从index.html中删除以下行来重构应用程序
<click-counter count="5"></click-counter>
<link rel="import" href="clickcounter.html">
Run Code Online (Sandbox Code Playgroud)
导致以下错误:
Exception: NoSuchMethodError: method not found: 'whenPolymerReady'
Receiver: Instance of 'JsFunction'
Arguments: [Closure: () => dynamic] (package:polymer/src/loader.dart:115)
Breaking on exception: NoSuchMethodError: method not found: 'whenPolymerReady'
Run Code Online (Sandbox Code Playgroud)
我一直在使用这种机制来创建任何聚合物应用程序,但是从未见过这样的例外,尽管我在网上看过涉及Dart的文档https://www.google.com.jm/url?sa=t&rct=j&q= &ESRC = S&源=幅和CD = 1&CAD = RJA&uact = 8&VED = 0CBwQFjAA&URL = HTTP%3A%2F%2Fcode.google.com%2FP%2Fdart%2Fissues%2Fdetail%3Fid%3D19161&EI = MZq8U_nlK42KyASBkYHgCw&USG = AFQjCNHOc6MD-mhzPbDOmg8Hp5NeqVufqQ&BVM = bv.70138588,d.噢
该文件表明这个问题已经解决,但它肯定存在于我正在使用的现有聚合物中.
我想直接通过命令行或通过dart文件中的“处理”调用聚合物web应用程序。
我知道通过dart编辑器运行它时,会在端口8080上创建一个服务器,并侦听/ web文件夹的请求。
但是启动时
dartium / chrome.exe路径/收件人/Index.html
从控制台它只是加载浏览器中的文件,但不会为客户端启动服务器。
通过file :: //path/to/file.html [没有'dart not runnning'警告,但没有聚合物含量]或127.xxxxxxxx:xxxxxxxx / app / index.html显然会告诉我
'此网页无法使用'
我有一个CustomPassword组件,并希望提供一种方法isActive
,允许您检索组件是否仍然是此网站上的活动元素.
示例代码:
custom_password.html
<polymer-element name="custom-password">
<template>
<div>Other things here</div>
<input id="password-field" type="password" value="{{value}}">
</template>
<script type="application/dart" src="custom_password.dart"></script>
</polymer-element>
Run Code Online (Sandbox Code Playgroud)
custom_password.dart
import 'package:polymer/polymer.dart';
@CustomTag('custom-password')
class CustomPassword extends PolymerElement {
@published
String value;
CustomPassword.created() : super.created() {
}
bool isActive() {
// TODO figure out if the CustomPassword element is still active.
return false;
}
}
Run Code Online (Sandbox Code Playgroud) 我是飞镖和聚合物的初学者.当我在Chrome中运行网络应用时,我得到:
Uncaught HierarchyRequestError: Failed to execute 'appendChild' on 'Node': Nodes of type 'HTML' may not be inserted inside nodes of type '#document'. patches-mdv.js:57
(anonymous function) patches-mdv.js:57
(anonymous function) patches-mdv.js:57
(anonymous function) patches-mdv.js:57
Run Code Online (Sandbox Code Playgroud)
appendChild可能是生成的dart2js代码,即下面的部分:
Node: {
"^": "EventTarget;ownerDocument=,text:textContent=",
remove$0: function(receiver) {
var t1 = receiver.parentNode;
if (t1 != null)
J._removeChild$1$x(t1, receiver);
},
toString$0: function(receiver) {
var t1 = receiver.nodeValue;
return t1 == null ? J.Interceptor.prototype.toString$0.call(this, receiver) : t1;
},
append$1: function(receiver, newChild) {
return receiver.appendChild(newChild);
},
insertBefore$2: function(receiver, newChild, refChild) { …
Run Code Online (Sandbox Code Playgroud) 使用polymer.dart的Dart应用程序的pubspec.yaml文件看起来像这样(来自Polymer.dart代码实验室):
name: polymer_and_dart
description: Sample app built with the polymer.dart package
environment:
sdk: '>=1.2.0 <2.0.0'
dependencies:
polymer: '>=0.12.0 <0.13.0'
dev_dependencies:
unittest: '>=0.10.0 <0.11.0'
transformers:
- polymer:
entry_points:
- web/begin/index.html
- web/end/index.html
Run Code Online (Sandbox Code Playgroud)
什么的entry_points
其实是什么意思?声明入口点实际上做了什么?
我在Dart SDK版本1.8.0中使用Dart Editor版本1.8.0.release(STABLE).
当我做一个构建dart2js我得到错误:"/ Volumes/data/b/build/slave/dart-editor-mac-stable/build/dart/sdk/lib/_internal/pub_generated/lib/src/barback/pub_package_provider .dart 87 PubPackageProvider._assertExists /Volumes/data/b/build/slave/dart-editor-mac-stable/build/dart/sdk/lib/_internal/pub_generated/lib/src/barback/pub_package_provider.dart 41 getAsset .. join0.join1 /Volumes/data/b/build/slave/dart-editor-mac-stable/build/dart/sdk/lib/_internal/pub_generated/lib/src/barback/pub_package_provider.dart 52 getAsset..join0/Volumes /data/b/build/slave/dart-editor-mac-stable/build/dart/sdk/lib/_internal/pub_generated/lib/src/barback/pub_package_provider.dart 76 getAsset.dart:isolate _RawReceivePortImpl._handleMessage这是一个意外错误.请运行
pub --trace 'build' '--mode' 'debug' '--all'
Run Code Online (Sandbox Code Playgroud)
并将结果包含在http://dartbug.com/new上的错误报告中."
没有内置/ build.它与SDK版本1.7一起使用.有人有一些有用的反馈?
谢谢!
使用新的测试库来测试Dart Polymer元素,我my_element_test.html
按照规定构建.请参阅我的回购:聚合物飞镖测试.
my_element_test.html
和my_element_test.dart
(注释掉聚合物启动)按预期通过测试:
<!doctype html>
<html>
<head>
<title>My Element Test</title>
<link rel="import" href="packages/polymer_dart_testing/my_element.html">
<link rel="x-dart-test" href="my_element_test.dart">
<script src="packages/test/dart.js"></script>
</head>
<body>
<div>Custom HTML Test is Custom.</div>
<my-element></my-element>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
import 'package:test/test.dart';
import 'package:polymer_dart_testing/my_element.dart';
import 'package:polymer/polymer.dart';
import 'dart:html';
main() {
setUp(() async {
// await initPolymer();
// return await Polymer.onReady;
});
test('custom_html_test', (){
expect(true, isTrue);
});
}
Run Code Online (Sandbox Code Playgroud)
pub run test...
在添加test/my_element_test.html …