使用 javascript 关闭 paper-dialog 或 paper-action-dialog

Question

在我的用例中，我有一个纸质操作对话框，我将其用作第一个运行对话框，这样我就可以从用户那里获取服务器连接信息。我正在使用 autoclosedisabled 属性，因为我不希望用户在获取服务器详细信息之前单击对话框并关闭。当用户提交详细信息时，我希望对话框保持打开状态，直到我从服务器收到 return 告诉应用程序详细信息有效。然后我想用 javascript 关闭对话框并执行 ajax 数据调用。

html

<paper-action-dialog id="firstRun" autoclosedisabled transition="core-transition-center">
  <custom-form></custom-form>
</paper-action-dialog>

目前我正在使用 document.querySelector('core-overlay-layer').classList.remove('core-opened'); 它确实会关闭对话框，但看起来这会导致您尝试打开的任何对话框出现问题，并导致吐司出现问题。那么您必须重新加载应用程序以更正问题。

是否可以用 javascript 关闭纸质对话框或纸质操作对话框？

我真的不喜欢在用户单击提交时关闭对话框的想法，如果出于任何原因提交失败，只是为了再次打开。

提前致谢

Answer 1

是的，像这样调用close方法即可。$.firstRun.close()

一个例子：https://github.com/Kalitte/polymer-router-demo/

Answer 2

你试过元素的.toggle()方法吗？您可以在聚合物就绪事件后访问该元素

var el = document.getElementById('yourdialogid');
el.toggle()

Answer 3

除了其他答案，您还可以在标签上使用 "opened" 属性：

<paper-action-dialog opened="{{dialogOpen}}"></paper-action-dialog>

然后在你的 js 中的任何 Polymer 函数调用中，只需说：

foo: function(){
   this.dialogOpen = true;
}

我喜欢这种方法，因为对我来说它似乎更 "Polymerish" 因为它涉及使用属性。不管怎样。

此外，另一种类似于先前答案的方法是在您的任何函数中使用 Polymers 神奇的 $ 东西：

this.$.firstRun.toggle();

您可以使用 this.$.id 访问任何聚合物元素及其方法。

使用 javascript 关闭 paper-dialog 或 paper-action-dialog

close paper-dialog or paper-action-dialog with javascript

javascript

polymer