dom-if与Polymer 1.x有关

Question

我在模板转发器中有几个有条件标记的元素.现在,当我更新数据时,if条件似乎没有生效,这导致undefined传递到处理这些元素的数据的函数.

使用该restamp属性似乎没有帮助(https://www.polymer-project.org/1.0/docs/devguide/templates.html#dom-if).到目前为止,我只能通过清空this.items = [];我的更改处理程序中的items属性来解决这个问题,该处理程序启动了一个新的请求.

这样可行,但在显示新数据之前,模板会在很短的时间内变空.不一定是个问题,但我想知道我做错了什么.

以下是代码的相应部分:

<template>
...
<iron-ajax
  id="ironajax"
  url="https://www.url.com/api"
  params="{{ajaxParams}}"
  handle-as="json"
  on-response="handleResponse"
  on-error="handleError">
</iron-ajax>
...
<template is="dom-repeat" items="{{items}}" id="items">
...
<template is="dom-if" if="{{item.info.subtitle}}">: 
  <span>{{truncateSubtitle(item.info.subtitle)}}</span
</template>
...
Polymer({
  is: 'my-element',
  properties: {
    query: {
      type: String,
      value: ''
    }
    ...
    items: {
      type: Array,
      value: []
    }
  }
  ...
  handleChange: function() {
    if (this.value !== '') {
      this.items = [];
      this.query = this.value;
      this.$.ironajax.generateRequest();
    }
  }
...

Answer 1

给定"{{item.info.subtitle}}",如果item.info是null或者undefined如果item.info.subtitle是undefined,则绑定将不刷新并且可能具有陈旧值(在重复使用节点的情况下).

Polymer不会对undefined值执行计算,因为它在很多情况下都是性能增强,但在这种情况下它可能很棘手.

您应该使用函数来解决正确的状态.就像是

if="{{hasSubtitle(item)}}"

和

hasSubtitle function(item) {
  return item.info && item.info.subtitle;
}