AngularJS: display an OS “file save” dialog but not actually save

Question

All I need to do, on an ng-click open a file "save" dialog from the browser, cross-platform. I am not trying to actually save anything; this is a demo/prototype only and I want to show the flow to stakeholders.

Every answer I find on SO are complex ways to save the contents of the window or a file blob, but I don't need to do that.

I am hoping for something similar to $window.prompt, but for the file dialog.

Is there anything?

Answer 1

Building off azad's comment, you can use a hidden <input type="file"> and trigger it with a <label> .

Edit: style the <label> to look like a button for better browser compatibility.

 #download { display: none; } .download-button { border-radius: 28px; font-family: Arial; color: white; font-size: 14px; background: #3498db; padding: 10px 15px 10px 15px; display: inline-block; } .download-button:hover { background: #3cb0fd; } 

 <input id="download" type="file" /> <label for="download" class="download-button"> Save As </label> 

Answer 2

您可以将锚标记与download属性一起使用。

<a href="#" download="defaultfilename">Click me</a>