Question

我按照本教程使用Polymer构建Material Design应用程序。

http://io2014codelabs.appspot.com/static/codelabs/polymer-build-mobile/#6

当我实现这个时，我得到了这个错误

TypeError：无法读取属性＆＃39; save＆＃39;未定义的

这个错误发生在dataChanged函数

中谁知道为什么？

＆＃13;

<link rel="import" href="bower_components/polymer/polymer.html">
<link rel="import" href="bower_components/font-roboto/roboto.html">
<link rel="import" href="bower_components/core-drawer-panel/core-drawer-panel.html">
<link rel="import" href="bower_components/core-header-panel/core-header-panel.html">
<link rel="import" href="bower_components/core-toolbar/core-toolbar.html">
<link rel="import" href="bower_components/core-icons/core-icons.html">
<link rel="import" href="bower_components/paper-icon-button/paper-icon-button.html">
<link rel="import" href="bower_components/paper-fab/paper-fab.html">
<link rel="import" href="bower_components/paper-input/paper-input.html">
<link rel="import" href="bower_components/paper-checkbox/paper-checkbox.html">
<link rel="import" href="bower_components/core-localstorage/core-localstorage.html">


<polymer-element name="codelab-app">
<template>
  <link rel="stylesheet" href="styles.css">
  <core-drawer-panel id="drawerPanel" responsiveWidth="600px">

    <core-header-panel drawer>
      <core-toolbar>Menu</core-toolbar>
    </core-header-panel>

    <core-header-panel main>
      <core-toolbar>
        <paper-icon-button icon="menu" on-click="{{toggleDrawer}}"></paper-icon-button>
        <span flex>My notes</span>
        <paper-icon-button icon="search"></paper-icon-button>
        <paper-icon-button icon="more-vert"></paper-icon-button>
        <paper-fab icon="icons:add" on-click="{{showNewNoteInput}}"></paper-fab>
      </core-toolbar>
      <div class="content">
        <paper-input id="newNoteInput"
             floatingLabel
             label="Add a new note"
             on-change="{{add}}"
             value="{{newNote}}"></paper-input>
        <template repeat="{{data}}" >
          <div center horizontal layout class="item">
            <paper-checkbox checked="{{done}}" on-change="{{dataChanged}}"></paper-checkbox>
            <div flex class="card">
              <p>{{body}}</p>
            </div>
          </div>
          <core-localstorage id="storage" name="codelab-app-storage" value="{{data}}"></core-localstorage>
        </template>
      </div>
    </core-header-panel>

  </core-drawer-panel>
</template>
<script>
  Polymer('codelab-app', {
    data: [],
    add: function() {
      if (this.newNote) {
        this.data.unshift({
          body: this.newNote,
          done: false
        });
        this.$.newNoteInput.style.display = 'none';
        this.$.newNoteInput.value = null;
      }
    },
    toggleDrawer: function() {
      this.$.drawerPanel.togglePanel();
    },
    ready: function() {
      this.$.newNoteInput.style.display = 'none';
    },
    showNewNoteInput: function() {
      this.$.newNoteInput.style.display = 'block';
    },
    dataChanged: function() {
      this.$.storage.save();
    }
  });
</script>
</polymer-element>

＆＃13;

Answer 1

您正在循环创建静态ID标记，并且因为您不应该重复ID，所以它会引发错误。

导致问题的行：

<template repeat="{{data}}" >
          <core-localstorage id="storage" name="codelab-app-storage" value="{{data}}"></core-localstorage>
</template>

Polymer core-localstoreage TypeError：无法读取属性＆＃39; save＆＃39;未定义的

1 个答案: