聚合物核心localstoreage TypeError：無法讀取未定義的屬性'保存'

Question

我正在按照本教程使用Polymer構建Material Design應用程序。

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

，當我實現這個我得到這個錯誤

類型錯誤：無法讀取屬性「拯救」的不確定

這個錯誤在dataChanged功能發生

人知道爲什麼？

<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>

Answer 1

你循環靜態ID標籤的創造，因爲你不應該有一個ID的副本，它拋出一個錯誤。

行導致了問題：

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