Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/418.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 复制并粘贴文件的内容以将其上载到Angular 9?_Javascript_Angular_Typescript_Angular9 - Fatal编程技术网

Javascript 复制并粘贴文件的内容以将其上载到Angular 9?

Javascript 复制并粘贴文件的内容以将其上载到Angular 9?,javascript,angular,typescript,angular9,Javascript,Angular,Typescript,Angular9,我有一个示例,用户上传两个文件,文件被发送到服务器进行处理,服务器返回结果。但我想要一个功能,我可以有两个文本框,用户只需复制粘贴两个文件的内容,而不是浏览和上传文件。我有以下代码: app.component.html 从'@angular/core'导入{Component}; 从'@angular/common/http'导入{HttpClient}; 从“rxjs”导入{observeable,Subject}; @组成部分({ 选择器:'应用程序根', templateUrl:“./a

我有一个示例,用户上传两个文件,文件被发送到服务器进行处理,服务器返回结果。但我想要一个功能,我可以有两个文本框,用户只需复制粘贴两个文件的内容,而不是浏览和上传文件。我有以下代码:

app.component.html

从'@angular/core'导入{Component};
从'@angular/common/http'导入{HttpClient};
从“rxjs”导入{observeable,Subject};
@组成部分({
选择器:'应用程序根',
templateUrl:“./app.component.html”,
样式URL:['./app.component.css']
})
导出类AppComponent{
firstfile=null;
第二个文件=null;
标题=‘第一’;
第一部分内容:任何
更新内容:布尔值=false;
构造函数(专用http:HttpClient){
this.content\u updated=false;
}
firstfileupload(事件){
console.log(“第一个文件”)
//console.log(事件)
this.firstfile=event.target.files.item(0)
此.readFileContent(event.currentTarget.files[0])。订阅(
内容=>{
对于(内容的常量行。拆分(/[\r\n]+/){
如果(行!=''){//{
对于(内容的常量行。拆分(/[\r\n]+/){
如果(行!=''){//{
console.log(res)
}
)
}
私有readFileContent(文件):可观察{
让结果=新主题();
const reader=new FileReader();
reader.onload=(e)=>{
const fileContent=e.target.result;
结果。下一步(文件内容);
};
reader.readAsText(文件);
返回结果。asObservable();
}
}
app.component.html

上传文件
上传
如您所见,我只是将用户输入的内容作为文件发送给用户。如何使用户能够将内容复制粘贴到文本区域,并将内容作为文件发送给服务器。提前感谢


注:请忽略所有额外的代码,我的重点是如何获取用户输入,转换为文件并将其发送到服务器。在上面的代码中,我没有任何与我的问题相关的逻辑,我只是获取文件输入。

HTML:-

<div> Input Text Below </div>
<textarea id="fileData" [(ngModel)]="data"></textarea>
<button (click)="sendData()">Send Data</button>
public data = '';
public sendData() {
  this.http.post('http://localhost:5000',this.data).subscribe(res =>{
      console.log(res)
  });
}
在Ts中,如果需要以文件形式发送。

public data = '';
    public sendData() {
      var blob = new Blob(["This is my first text."], {type: "text/plain;charset=utf-8"});
      var formData = new FormData();
      formData.append('file',blob);
      this.http.post('http://localhost:5000',formData).subscribe(res =>{
          console.log(res)
      });
    }

因此,您希望textarea中的数据在服务器上作为文件接收??是的,我希望将数据作为文件发送。我将如何访问服务器端的文件?到目前为止,
fd.append('files',this.firstfile)
我能够这样做,并通过执行
request.files.getlist('files')在服务器端获取文件
.server将获取request.body中的数据。它将是文本,而不是文件。但我想将其作为文件发送,因为我不想对我的服务器进行任何更改,是否有任何方法可以将数据作为文件发送?此外,这不起作用,它会抛出一个错误,即数据未定义。是的,数据错误已被删除,但我是否可以将数据作为文件发送档案?