Question

你如何处理这件简单的事情？

在处理评论的元素中，我得到输入：

CoreInput get name =＆gt; $ [＆＃39;名称＆＃39;]; CoreInput get comment =＆gt; $ [＆＃39;评价＆＃39;];

但整个评论区域都包含一个if =＆＃34; {{app.user！= null}}＆＃34;，所以当元素首次加载时，那些getters = null，因为app.user只是在app加载并附加元素后确定。

因此，当我转到我直接评论的项目时，它会在添加评论时触发错误。因为在app.user评估为true之前附加了元素。

当来自不同的页面/元素，我们已经有app.user时，一切都很好。

当我将这些定义移动到addComment（）方法本身时（仅当我们有app.user时才可用）...

CoreInput name = $ [＆＃39; name＆＃39;]; CoreInput评论= $ [＆＃39;评论＆＃39;];

......同样的事情！从$切换到querySelector，同样的事情。

（伙计，所有这些东西真的很妨碍。我们需要聚合物的最佳实践文档！）

Answer 1

实际上，$是在模板首次“加盖”后立即填充的简单Map，因此不包含动态添加的项目，例如模板条件中的情况。

最好的解决方案是以完全不同的方式考虑它：将表单值绑定到可观察的Map，例如名为theData。

这里很好地解释了这一点：https://www.dartlang.org/docs/tutorials/forms/#binding-data

然后，无论表单元素是否存在，我们都可以访问这些值 - 如果不存在，则Map已设置默认（空白）值。（无论如何，当我们知道表单元素存在时，我们可能只引用这些值。）

class MyElement extends PolymerElement {
  @observable Map theData = toObservable({
    'name': '',
    'comment': ''
  });
  ...

  addComment(Event e, var detail, Element target) {
    e.preventDefault();

    String name = theData['name'];
    name = name.trim();
    String comment = theData['comment'];
    comment = comment.trim();
    ...

瞧！表单和Dart代码之间的双向数据绑定，这一切都让Polymer感觉很新鲜。

在符合<template if =“”>条件</template>后，项目在可见时不会显示在$中

1 个答案: