我尝试在html formly-form上使用angular点击“Submit”后将数据写入json文件,但什么也没有发生。我知道我可以使用angular读取json文件,但不确定是否可以创建文件。onSubmit()在控制器中:
function onSubmit() {
$scope.save = function() {
$http.post('./temp/sample_data.json', JSON.stringify($scope.model)).then(function(data) {
$scope.msg = 'Data saved';
});
};
};
网页:
<form name="form" ng-submit="onSubmit()" novalidate>
<formly-form model="model" fields="fields"></formly-form><br/>
<button type="submit">Submit</button>
</form>
sample_data.json没有被创建,如果我创建一个空文件,它也不会被数据填充。$scope.model防御性地包含数据。如果有人可以帮助,将不胜感激。谢谢,Alon。
6条答案
按热度按时间biswetbf1#
有没有可能只使用angular将数据写入本地json文件?
不能。即使你是从本地文件系统(例如
file://myfile.html
)或本地web服务器(例如http://localhost/myfile.html
或http://host-on-my-intranet/myfile.html
)运行页面,你仍然无法直接从浏览器托管的JavaScript代码写入文件。两个选择:
1.将其发送到可以将其写出的对象(例如,服务器),或者
1.将其作为
data:
URI提供(如果在您的情况下可行),用户可以右键单击并选择“保存为...”以下是如何为一些JSON文本创建
data:
URI:2的完整示例:
koaltpgm2#
没有。
Angular运行客户端。
如果你想将数据写入服务器(即使是与浏览器在同一台计算机上的服务器),那么你需要服务器端代码来完成。
eyh26e7m3#
你不能从Javascript直接访问本地文件系统。这是出于安全原因而强制执行的(当你考虑它时,这是有意义的!)。
Local file access with javascript
7vhp5slm4#
因为这是不可能的,你可以尝试另一个路由。你的$scope.save没有被调用,只是被分配了。
要恢复模型,请在init上执行以下操作:
hsvhsicv5#
下面的代码为JSON对象添加下载按钮。
**注意:**不建议在HTML5中使用锚标签 Package 按钮,但它在Chrome中可以工作,这是我所需要的。YMMV。
超文本:
typescript :
k0pti3hp6#
好吧,我在这里挖掘过去,但这个问题仍然是相关的,从我今天寻找它来判断。
接受的答案是正确的,我只是想添加这个在Angular 15中工作的实现,从按钮单击处理程序中,不向DOM添加实际元素,也设置下载文件的名称。它处理的是.csv文件,但对于.json也是一样的。
在模板中(使用Angular Material):
单击此按钮将启动生成文件的下载。