Question

我有一个主要细节场景。我使用paper-datatable by David Mulder作为我的用户列表。数据通过firebase集合填充点击一行时，会弹出一个纸质对话框，其中包含所选用户的详细信息。尝试编辑字段时，在一次击键后，firebase的更新会停止。

我错过了什么？

<dom-module id="user-list">
    <template>
        <style>
        :host {
            @apply(--layout-vertical);
        }

        #editDialog {
          min-width: 500px;
        }
        </style>
        <firebase-collection location="https://<FIREBASE_APP>.firebaseio.com/users" data="{{users}}"></firebase-collection>

        <paper-dialog id="editDialog" entry-animation="scale-up-animation" exit-animation="fade-out-animation" with-backdrop>
            <div>
                <paper-input value="{{selectedUser.name}}" label="Name" class="flex"></paper-input>
                <paper-input value="{{selectedUser.username}}" label="Username" class="flex"></paper-input>
            </div>
            <div class="buttons">
                <paper-button dialog-confirm autofocus>Ok</paper-button>
            </div>
        </paper-dialog>

        <paper-datatable id="datatable" selected-item="{{selectedUser}}" selectable on-row-tap="_onDetail" data="{{users}}">
            <div no-results>
                Loading or no more items...
            </div>
            <paper-datatable-column header="Name" property="name" type="String" sortable style="min-width: 160px"></paper-datatable-column>
            <paper-datatable-column header="Username" property="username" type="String" sortable style="min-width: 40px"></paper-datatable-column>
        </paper-datatable>
    </template>
    <script>
    Polymer({
        is: 'user-list',

        behaviors: [
            Polymer.NeonAnimatableBehavior
        ],

        properties: {
            type: String,
            selectedUser: {
              type: Object,
              notify: true
            },
            users: {
                type: Array,
                notify: true
            },
            animationConfig: {
                value: function() {
                    return {
                        'entry': {
                            name: 'fade-in-animation',
                            node: this
                        },
                        'exit': {
                            name: 'fade-out-animation',
                            node: this
                        }
                    }
                }
            }
        },

        _onDetail: function() {
            var dialog = document.getElementById('editDialog');
            if (dialog) {
                dialog.open();
            }

        }
    })
    </script>
</dom-module>

Answer 1

似乎firebase-collection目前不打算以这种方式使用，它更像是一个Firebase位置的视图，其数据位于类似数组结构中。虽然您可以添加/删除新项目但不更新现有项目。请参阅https://elements.polymer-project.org/elements/firebase-element?active=firebase-collection。

也就是说，集合中的每个项目都有一个__firebaseKey__属性，您可以使用该属性直接更新firebase中的该项目。

firebase-collection：输入值仅更新第一次击键

1 个答案: