Question

我有一个paper-dialog，在这个对话框中我有paper-input有一些预先定义的值，当我想更改值时，我的对话框没有明显的原因关闭。

我的代码：

<template>
  <paper-dialog entry-animation="scale-up-animation"
                exit-animation="fade-out-animation"
                id="bookDetailDialog"
                class="bookDialog"
                opened="{{opened}}">
    <paper-item style="padding-left: 11px;">
      <paper-icon-button 
            icon="icons:arrow-back" 
            on-tap="closeDialog">
      </paper-icon-button>
    </paper-item>
    <paper-item>
        <paper-input label="Author" value="{{book.author}}"></paper-input>
    </paper-item>
    ...
    <paper-item>
        <paper-checkbox checked="{{book.dedication}}">Dedication</paper-checkbox>
    </paper-item>
    <paper-button raised>Lent</paper-button>
    <paper-button raised>Sell</paper-button>
  </paper-dialog>
</template>
<script>
  Polymer({

  is: 'book-dialog',

  properties: {
    book: {
      notify: true
    },
    opened: {
      type: Boolean,
      notify: true
    }
  },

  closeDialog: function () {
    this.opened = false;
    this.book = undefined;
  }
 });
</script>

编辑：这是我使用我的元素的地方：

<dom-module id="books-list">
  <style>
    span {
      flex-basis: 100%;
      margin: auto;
    }
  </style>
  <template>
    <book-dialog opened="{{opened}}" book="{{selected}}"></book-dialog>
    <iron-list
        id="bookList"
        items="{{books}}"
        as="book"
        selection-enabled
        selected-item="{{selected}}">
      <template>
        <paper-item>
          <span>{{book.id}}</span>
          <span>{{book.author}}</span>
          <span>{{book.original}}</span>
          <span>{{book.language}}</span>
          <span>{{book.status}}</span>
        </paper-item>
      </template>
    </iron-list>
  </template>
  <script>
    Polymer({
      is: 'books-list',

      properties: {
        books: {
          notify: true
        },
        selected: {
          notify: true,
          obsever: '_selectionChanged'
        },
        opened: {
          notify: true,
          type: Boolean
        }
      },

      observers: [
        '_selectionChanged(selected)'
      ],

      _selectionChanged: function () {
        if (this.get('selected.id') === '' 
         || this.get('selected.id') === undefined) {
        this.set('opened', false);
        } else {
          this.set('opened', true);
        }
      },

      _openAddBookDialog: function () {
        this.fire('add-book');
      }

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

编辑：我认为它与iron-list有关，而selected属性更改...

Answer 1

我不确定你是否还在寻找这个，但是，我会为偶然发现这个问题的人提供这个。
有关纸张对话的相关问题的解释提供了解释 - PolymerElements/paper-input Issue#263

基本上，您必须处理来自paper-input的点击事件，以便它不会传播以关闭paper-dialog。
希望有所帮助。

纸张输入的纸张对话框在输入时关闭

1 个答案: