聚合物 - Dart等价函数 [英] Polymer-Dart Equivalent Functions

问题描述

我正在尝试通过Google I / O代码实现Material Design Web App，但将其移植到Dart语言。 http://io2014codelabs.appspot.com/static/codelabs/polymer- build-mobile /＃4

我在切换抽屉的步骤，但我不知道飞镖的等效。 p>

切换抽屉的JS代码如下：

 < script> 
 Polymer（'codelab-app'，{
 toggleDrawer：function（）{
 this。$。drawerPanel.togglePanel（）; 
} 
}）; 
< / script> 
 

我在我的CodelabApp类中尝试了以下代码，但我得到一个 NoSuchMethodError ：method not found：'togglePanel'

  @CustomTag codelab-app'）
 class CodelabApp extends PolymerElement {
 CodelabApp.created（）：super.created（）{} 
 void toggleDrawer（）{
 querySelector -panel'）.. togglePanel（）; 
} 
} 
  

我的按钮元素正确触发，但我不能找出如何调用抽屉的togglePanel方法。 < paper-icon-button icon =menuon-click ={{toggleDrawer}}>< / paper-icon-button>

更新：

这在最近的版本中已修复： https：// github.com/dart-lang/core-elements/issues/39

更新聚合物和core_elements库的工作原理如预期。

解决方案

在尝试提交自己的修复时，我发现了一个临时的解决方法，在我的情况下。也许会为你工作）

将以下内容添加到文件顶部：

  import'dart：js'show JsObject; 
 
 _js（x）=> new JsObject.fromBrowserObject（x）; 
  

然后更改您的自定义标签代码：

 CodelabApp.created（）：super.created（）：class =lang-dart prettyprint-override>  @CustomTag（'codelab-app' {} 
 void toggleDrawer（）{
 _js（shadowRoot.querySelector（'core-drawer-panel'））。callMethod（'togglePanel'）; 
} 
} 
  

参考我通过阅读代码找到了这个解决方案这里：
https：/ /github.com/dart-lang/core-elements/blob/master/example/core_drawer_panel.html#L68-L81

I'm trying to work through a Google I/O codelab for the Material Design Web App, but port it to the Dart language. http://io2014codelabs.appspot.com/static/codelabs/polymer-build-mobile/#4

I'm at the step where you toggle the drawer, but I can't figure out the dart equivalent.

The JS code to toggle the drawer looks like this:

<script>
  Polymer('codelab-app', {
    toggleDrawer: function() {
      this.$.drawerPanel.togglePanel();
    }
  });
</script>

I have tried the following in my CodelabApp class, but I get a NoSuchMethodError: method not found: 'togglePanel'

@CustomTag('codelab-app')
class CodelabApp extends PolymerElement {
  CodelabApp.created() : super.created() {}
  void toggleDrawer() {
    querySelector('core-drawer-panel')..togglePanel();
  }
}

my button element properly fires, but I can't figure out how to call the drawer's togglePanel method. <paper-icon-button icon="menu" on-click="{{toggleDrawer}}"></paper-icon-button>

any help or direction to the proper docs would be greatly appreciated.

UPDATE:

This has been fixed in recent versions: https://github.com/dart-lang/core-elements/issues/39

Updating the polymer and core_elements libraries works as expected.

解决方案

While attempting to commit my own fix to this, I discovered a temporary workaround that works in my case. Maybe will work for you :)

Add the following to the top of your file:

import 'dart:js' show JsObject;

_js(x) => new JsObject.fromBrowserObject(x);

Then change your custom tag code:

@CustomTag('codelab-app')
class CodelabApp extends PolymerElement {
  CodelabApp.created() : super.created() {}
  void toggleDrawer() {
    _js(shadowRoot.querySelector('core-drawer-panel')).callMethod('togglePanel');
  }
}

For reference I found this solution by reading through the code here: https://github.com/dart-lang/core-elements/blob/master/example/core_drawer_panel.html#L68-L81

这篇关于聚合物 - Dart等价函数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！