数据绑定到Polymer中的动态路径 [英] Data binding to a dynamic path in Polymer
问题描述
我正在使用Polymer 1.0和Firebase构建一个Web应用程序,并且我希望在将数据输入到路径中且路径中带有用户ID的情况下更改视图.为此,我想做这样的事情:
I am building a web app with Polymer 1.0 and Firebase, and I want to have the view change when data was entered into a path with a user ID in the path. To do that, I want to do something like this:
[[question.answers.(user.uid).choice]]
让我详细解释.所以,在模板中,我有这样的东西:
Let me explain in more detail. So, in the template, I have something like this:
<ul id="question-list">
<template is="dom-repeat" items="[[questions]]" sort="_computeSort" as="question">
<li class="card question" data-key="[[question.$key]]" question="[[question]]">
<h3 class="content">[[question.question]]</h3>
<p hidden$="[[ MY DATA BINDING HERE ]]">[[question.afterMessage]]</p>
</li>
</template>
</ul>
如果您查看上面的<p>
元素,则在hidden
属性内是我希望进行数据绑定的地方. questions
路径的结构如下:
If you look at the <p>
element above, inside the hidden
attribute is where I want to have my data binding to happen. The structure of a questions
path is like this:
所以questions
是问题的集合,每个问题都有一个属性afterMessage
,我想在回答问题后向用户显示该属性.
So questions
is a collection of questions, and each question has a property afterMessage
, which I want to show the user after answering the question.
为了检查用户是否回答了问题,我在questions
路径中有一个名为answers
的路径.在该answers
路径内,我将用户的密钥作为用户选择的密钥.
In order to check if the user has answered the question, I have a path called answers
within the questions
path. Inside that answers
path, I have the users's key as a key to the choice that the user chose.
因此,如果用户密钥为ZjHDMDa270Uyp6sAL02Mam2ftGf2
的用户登录到我的应用程序,则该用户答案的数据绑定路径为:
So, if a user with user key of ZjHDMDa270Uyp6sAL02Mam2ftGf2
is logged into my app, the data binding path to that user's answer would be:
[[quesion.answers.ZjHDMDa270Uyp6sAL02Mam2ftGf2.choice]]
现在上面的表达式是我要绑定的内容,但是用户ID随用户的不同而变化,那么我该怎么做呢?换句话说,我想做这样的事情:
Now this above expression is what I want to bind to, but of course the user ID changes from user to user, so how can I do this? In other words, I want to do something like this:
[[question.answers.(user.uid).choice]]
推荐答案
聚合物数据绑定不支持嵌套或表达式.您可能必须使用计算的绑定像这样:
Polymer data bindings don't support nesting or expressions. You would likely have to use a computed binding like this:
// template's computed binding
[[_getChoice(question, user.uid)]]
// script
Polymer({
_getChoice: function(question, uid) {
return question.answers[uid].choice;
},
...
});
这篇关于数据绑定到Polymer中的动态路径的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!