Question

我有一个包含大量对象的javascript数组，如下所示：

var myArray = [
    {
        "id": 1,
        "name": "Name 1",
        "active": false
    },{
        "id": 2,
        "name": "Name 2",
        "active": true
    },{
        "id": 3,
        "name": "Name 3",
        "active": false
    }
]

我使用这些对象的id参数来比较它们并存储值。为了获得属于该id的对象，我编写了一个过滤器：

getTest: function(id){
    var result = this.tests.filter(function(o){return o.id == id;} );
    return result ? result[0] : null;
}

所以我可以很容易地使用这个内联过滤器。现在我也希望获得内联过滤结果的属性，例如：

<template if="{{ { id | getTest }.active">
    You are active!
</template>

但这样做会导致表达无效。我已多次阅读docs，但不太清楚这是否可能。

我该怎么做？

Answer 1

您可以使用id参数制作自定义过滤器。该过滤器将获取该项目，验证它是否具有良好的ID，并验证它是否有效。

我的原始示例是在此Plunker http://plnkr.co/edit/FSwzndyjRxJIymehsZIg?p=preview

中

希望它有所帮助！如果它不是您想要做的，请询问，我会尝试进一步回答：）

[编辑]

好的，看完你的评论后，这个怎么样：

  <template is="auto-binding">

  <h1>Hi !</h1>
   <template repeat="{{item in myArray}}">
      <template if="{{ item.active }}">
        <p>
        Item id:{{item.id}} is active! <br>
        Amount of steps in this test: {{ item.steps }} <br>
        Test description: {{ item.description }}
        </p>
      </template>
   </template>
  </template>

  <script>
    var template = document.querySelector('template[is="auto-binding"]');
    template.count=0;
    template.myArray = [
      {
        "id": 1,
        "name": "Name 1",
        "active": false,
        "steps": 3,
        "description": "Lorem"
      },{
        "id": 2,
        "name": "Name 2",
        "active": true,
        "steps": 4,
        "description": "Ipsum"
      },{
        "id": 3,
        "name": "Name 3",
        "active": true,
        "steps": 5,
        "description": "Lorem Ipsum"
      }
    ];
</script>

然后你得到你想要的输出：

Item id:2 is active! 
Amount of steps in this test: 4 
Test description: Ipsum

Item id:3 is active! 
Amount of steps in this test: 5 
Test description: Lorem Ipsum

Plunker是http://plnkr.co/edit/nBYeeZ2Uw0EFihAhNYpl?p

Polymer获取filter返回的对象的属性

1 个答案: