关于https://www.polymer-project.org/1.0/显示使用 firebase 作为数据源的用法。不过我想使用一个简单的 js 变量(数组/对象)作为数据源，例如与 friend 的阵列。但是我没有将阵列绑定(bind)到 polymer 上。
如何将 js 数组作为数据绑定(bind)绑定(bind)到 polymer ？
示例 HTML 页面index.html
<!DOCTYPE html>
<html lang="en">
<head>
<script src="/bower_components/webcomponentsjs/webcomponents-lite.min.js"></script>
<link rel="import" href="friends-list.html">
</head>
<body>
<h1>Hello Data Object Arry Binding</h1>
<script>
var friends = [
{"name":"manual"},
{"name":"john"},
{"name":"doe","starred":true}
];
</script>
<friend-list data="friends"></friend-list>
</body>
</html
期望的friend-list.html Polymar可能是这样的:
<dom-module id="friend-list">
<link rel="import" type="css" href="friend-list.css">
<template>
<template is="dom-repeat" items="{{data}}">
<contact-card starred="{{item.starred}}">
<img src="{{item.img}}">
<span>{{item.name}}</span>
</contact-card>
</template>
</template>
<script>
Polymer({
is: 'friend-list',
properties: {
data: Object
}
});
</script>
</dom-module>
最佳答案
如果您想在元素声明之外使用数据绑定(bind)，则必须使用 dom-bind 模板。
<template is="dom-bind" id="app">
<h1>Hello Data Object Arry Binding</h1>
<friend-list data="{{friends}}"></friend-list>
</template>
<script type="text/javascript">
var app = document.getElementById('app');
app.friends = [
{"name":"manual"},
{"name":"john"},
{"name":"doe","starred":true}
];
</script>
关于javascript - Polymer WebComponents 数据绑定(bind) js 对象/数组，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/33525133/