标签: dart-html

如何在Dart Web应用程序中以60fps驱动动画循环或游戏循环？

我意识到,在当前飞镖SDK版本0.4.1.0_r19425方法,如setTimeout,setInterval,clearTimeout,clearInterval是不是部分Window类更多,他们都搬到了WorkerContext.
现在有没有关于如何使用它们的文档？WorkerContext每次我想使用它们时是否需要创建一个新实例？

刚刚开始修补Dart,我决定编写一个简单的Http Server和一个客户端.我的服务器代码:

#import("dart:io");

final HOST = "127.0.0.1";
final PORT = 8080;
final LOG_REQUESTS = true;

void main() {
  HttpServer server = new HttpServer();
  server.addRequestHandler((HttpRequest request) => true, requestReceivedHandler);
  server.listen(HOST, PORT);
  print("Server is running on ${PORT}."); 
}

void requestReceivedHandler(HttpRequest request, HttpResponse response) {
  var pathname = request.uri;
  var apiresponse="";
  if (LOG_REQUESTS) {
    print("Request: ${request.method} ${pathname}");
  }
  if(pathname == '/api'){
    response.headers.set(HttpHeaders.CONTENT_TYPE, "text/plain; charset=UTF-8");
    response.headers.add("Access-Control-Allow-Methods", "POST, OPTIONS, GET");
    response.headers.add("Access-Control-Allow-Origin", "*");
    response.headers.add('Access-Control-Allow-Headers', '*');
    print('welcome to the good life');
    response.outputStream.writeString("API Call");
    response.outputStream.close();
  }
}

我的客户代码: …

我尝试执行以下操作：

var properties = ["height" , "width"];
for (var prop in properties){
  div.style[prop] = otherdiv.style[prop];
}

但是 dart 似乎不接受这个括号表示法，还有其他方法可以使用 dart 中的字符串访问属性吗？

我从一些Dart例子开始.然后我想用这里document.query('#someId')描述的方式查询DOM ,但似乎文档中没有查询方法.通过`new Element.tag('p')创建一个新元素也行不通.

后来我弄清楚,它会工作,当我从改变导入的包dart:dom来dart:html.但是使用它们都给了我很多duplicate definition of _XYZ.

所以我想知道:

1. 什么是dart:html和dart:dom包之间的区别
2. 我应该使用哪一个
3. 为什么我不能同时使用两者

我正在尝试使用Dart找到一个简单的用户身份验证示例.到目前为止,我发现的最接近的是https://github.com/dart-lang/bleeding_edge/blob/master/dart/tests/standalone/io/http_auth_test.dart.任何人都可以指导或提供使用Dart的服务器端身份验证的工作示例.提前致谢.

我在SDK 0.7.3.1_r27487中升级了我的dart编辑器后遇到错误"删除不允许的属性".

我有一个自定义标签,其模板包含boostarp属性"data-target"和"data-toggle".它在以前的版本下工作但升级后遇到错误.

安慰

Removing disallowed attribute <A data-toggle="dropdown">
Removing disallowed attribute <BUTTON data-target=".navbar-collapse">
Removing disallowed attribute <BUTTON data-toggle="collapse">

.html代码

<element extends="div" name="x-navbar" constructor="Navbar">
<template>    
  ..
  <a name="top" href="#" class="dropdown-toggle" data-toggle="dropdown">Shop <b class="caret"></b></a>
  ..
  <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"></button>
</template>
<script type="application/dart" src="custom_ui.dart"></script> 
</element>

我在Polymer元素中显示国际化字符串,如下所示:

<div>
  <span class="title">{{title}}</span>
  <br/><br/>
  <span class="subtitle">{{subtitle1}}</span>
  <br/>
  <span class="content">{{paragraph1}}</span>
  <br/><br/>
  <span class="subtitle">{{subtitle2}}</span>
  <br/>
  <span class="content">{{paragraph2}}</span>
</div>

...并有以下飞镖码:

@observable String title;
@observable String subtitle1;
@observable String paragraph1;
@observable String subtitle2;
@observable String paragraph2;

//...

void onUpdateLocale(_locale) {
  title = getTitle();
  subtitle1 = getSubtitle1();
  paragraph1 = getParagraph1();
  subtitle2 = getSubtitle2();
  paragraph2 = getParagraph2();
}

//...

getTitle() => Intl.message('MY TITLE', name:'title',
    desc: 'This is my title',
    args: [],
    examples: {'None' : 0});
getSubtitle1() => Intl.message('Subtitle 1', name:'subtitle1',
    desc: 'This is my first …

我想平滑地滚动到我的页面的一部分.在jQuery中这样做:

$('html, body').animate({
    scrollTop: $('#anchorOfMyTargetSection').offset().top
}, 'slow');

在Dart,我可以制作卷轴,但我不知道如何设置它的动画:

int targetSection = querySelector('#anchorOfMyTargetSection').offsetTop;
window.scrollTo( 0, targetSection );

更具体地说,我正在做一个单页,其中包含指向自我页面中各节的链接.

以下是链接:

<nav>
    <ul class="nav-list">
        <li><a href="http://example.com/#title">Home</a></li>
        <li><a href="http://example.com/#about">About us</a></li>
        <li><a href="http://example.com/#products">Products</a></li>
        <li><a href="http://example.com/#services">Services</a></li>
        <li><a href="http://example.com/#contact">Contact</a></li>
    </ul>
</nav>

这是完整的jQuery代码:

// Generated by LiveScript 1.2.0
var smoothScrolling;
smoothScrolling = function(selector, offset){
  return $(selector).click(function(click){
    var link, anchor;
    click.preventDefault();
    link = $(this).attr('href');
    anchor = link.substring(link.indexOf('#'));
    return $('html ,body').animate({
      scrollTop: $(anchor).offset().top + offset
    }, 'slow');
  });
};
smoothScrolling('.nav-list a', -45);

这里是Dart代码(当然没有动画部分):

import 'dart:html';

void main() {
  smoothScrollingOffset = …

我的AngularDart项目中有一个角度组件的App布局.我怎样才能改变drawer从应用程序的布局persistent,以temporary在媒体屏幕的变化？