Pertanyaan

Bagaimana cara menganimasikan elemen <paper-dialog modal> saya di dalam elemen <header-panel> dengan laporan bug ini?

1. Elemen <paper-dialog modal> dalam <header-panel> muncul di belakang latar modalnya kecuali Anda menerapkan solusi (yaitu, "peretasan"). Lihat laporan bug ini untuk informasi lebih lanjut.

2. Saya menerapkan "perbaikan-peretasan" (solusi) tertentu untuk menyelesaikan masalah. Lihat jawaban saya untuk pertanyaan Stack Overflow ini untuk detailnya. Juga disertakan di bawah ini.

3. Rupanya, perbaikan retasan saya merusak animasi.

Lihat JS Bin ini untuk contoh perilaku animasi yang saya cari. (Perhatian pengguna Safari: Gunakan Chrome sebagai gantinya)

Pertama, tambahkan fungsi ini ke elemen khusus:

// https://github.com/PolymerElements/paper-dialog/issues/7
patchOverlay: function (e) {
  if (e.target.withBackdrop) {
    e.target.parentNode.insertBefore(e.target._backdrop, e.target);
  }
},

Kemudian tambahkan on-iron-overlay-opened="patchOverlay" ke <paper-dialog> sebagai berikut:

<paper-dialog on-iron-overlay-opened="patchOverlay">