Question

我想读取一个json文件，该文件存在于我的系统本地，在我的聚合物元素中。目前我已将json结构放在我的元素的task属性中（作为第一步）。我正在使用'dom-repeat'来解析json。但是输出中仍然看不到任何东西。

<ul>
  <template is="dom-repeat" items="{{items}}">
    <li><span>{{item}}</span></li>
  </template>
  <template is="dom-repeat" tasks="{{task}}">
    <li><span>{{task.task.name}}</span></li>
  </template>
</ul>

以上是我的！ - 模板 - ！聚合物元素。我试图阅读数组，即{{items}}和json，{{task}}

以下是剧本：

<script>
(function() {
  'use strict';

  Polymer({
    is: 'my-list',

    properties: {
      items: {
        type: Array,
        notify: true
      },
      task:{
        type: Array,
        value: function () { return []; } // Default value
      }
    },

    ready: function() {
      this.items = [
        'Responsive Web App boilerplate',
        'Iron Elements and Paper Elements',
        'End-to-end Build Tooling (including Vulcanize)',
        'Unit testing with Web Component Tester',
        'Routing with Page.js',
        'Offline support with the Platinum Service Worker Elements'
      ];
      this.task=[{
         "task": {
            "name": "Fan",
            "rules": [{
                     "name": "Check Blades",
                      "id": "1",
                      "steps": [{

                          "name": "Check motor",
                          "operator": "OR",
                          "number": "1",
                          "substeps": [{

                                "name": "SubStep1",
                                "function": "code",
                                "expression": "(FAULT_CODE) ==    {err05,err07,err06}",
                                "number": "1",
                                "timeperiod": "86400000"
                             }]
                        }]
                    }]
               }
        }]; 
      } 
  });
})();

我能够看到数组内容，即this.items，但不能查看json内容。任何人告诉我哪里出错了？以下是输出的屏幕截图，您可以在其中看到{{items}}但没有{{task}}详细信息。

Answer 1

浏览器不允许读取系统本地的文件。您唯一能做的就是提供一个文件输入，允许使用文件选择器选择文件，然后从那里读取它们。如果Web服务器在本地系统上运行并将该文件提供给客户端，则可以从本地系统中读取它们。

Answer 2

this.task是一个数组，因此您需要使用计算绑定来访问其值。

有关如何执行此操作的详细信息，请参阅docs中的相关部分。

读取聚合物1.0中的本地json文件

2 个答案: