如果底层数组得到更新,是否有Polymer dom api方法或其他方法自动更新带有其他元素的重复模板?
我有一个动态数组,可以通过ajax调用重复更新.此数组不断更改其长度(根据ajax响应逐步追加或删除元素).数组通过文档反映出来<template is="dom-repeat">.有没有办法在底层数组更新时自动更新dom?
目前,我能看到的唯一方法是
通过使用2,我将无法使用视图中自动更新列表的过渡效果.我希望能够使用这些效果.
我正在尝试使用此处提到的Custom CSS Mixins来设置纸质抽屉面板的样式.paper-drawer-panel.css文件适用
@apply(--paper-drawer-panel-left-drawer-container);
@apply(--paper-drawer-panel-main-container);
Run Code Online (Sandbox Code Playgroud)
分别用于抽屉和主容器.但是,使用mixins设置的样式似乎不起作用
下面是我使用过的纸质抽屉面板演示的代码.
<html>
<head>
<title>paper-drawer-panel demo</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<script src="bower_components/webcomponentsjs/webcomponents-lite.js"></script>
<link rel="import" href="bower_components/paper-styles/paper-styles.html">
<link rel="stylesheet" href="bower_components/paper-styles/demo.css">
<link rel="import" href="bower_components/paper-button/paper-button.html">
<link rel="import" href="bower_components/paper-drawer-panel/paper-drawer-panel.html">
<style>
#drawerPanel {
--paper-drawer-panel-left-drawer-container: {
background-color: #eee;
};
--paper-drawer-panel-main-container: {
background-color: gray;
};
}
</style>
</head>
<body class="unresolved fullbleed">
<paper-drawer-panel id="drawerPanel">
<div drawer>
<div>Drawer content... </div>
</div>
<div main>
<div>
<paper-button paper-drawer-toggle raised>toggle drawer</paper-button>
</div>
</div>
</paper-drawer-panel>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
https://elements.polymer-project.org/elements/paper-drawer-panel上的文档说明这也是有效的.
造型纸抽屉面板: …
我使用以下命令向自定义元素中的 div 添加了一个点击侦听器
var nicediv = document.getElementById('nicediv');
nicediv.addEventListener('tap',this.listenerfunc.bind(this),false);
Run Code Online (Sandbox Code Playgroud)
这是成功的,但我无法删除事件侦听器。这不起作用。
nicediv.removeEventListener('tap',this.listenerfunc);
Run Code Online (Sandbox Code Playgroud)
有什么想法吗?